.app-menu-toggle{flex:0 0 auto;width:44px;height:44px;padding:0;display:grid;place-items:center;border:1px solid #cbdcd5;border-radius:14px;background:#fff;color:#17312a;box-shadow:0 6px 16px rgba(20,56,44,.08);cursor:pointer;overflow:hidden}.app-menu-toggle>svg{grid-area:1/1;width:22px;height:22px}.app-menu-logo{grid-area:1/1;width:32px;height:32px;border-radius:9px;object-fit:cover}.app-menu-logo:not([hidden])+svg{display:none}
.app-menu-toggle:hover{background:#f2f8f5}.app-menu-toggle:focus-visible{outline:3px solid rgba(35,160,127,.25);outline-offset:3px}
.app-topbar{position:sticky;top:0;z-index:40;min-height:calc(72px * var(--app-ui-scale,1));padding:max(calc(10px * var(--app-ui-scale,1)),env(safe-area-inset-top)) calc(14px * var(--app-ui-scale,1)) calc(10px * var(--app-ui-scale,1));display:flex;align-items:center;gap:calc(11px * var(--app-ui-scale,1));border-bottom:1px solid rgba(90,120,109,.12);background:rgba(250,252,251,.92);backdrop-filter:blur(22px) saturate(1.18);box-shadow:0 6px 22px rgba(25,57,47,.055)}
.app-header-brand{min-width:0;flex:1}.app-header-brand strong{display:block;font-size:calc(20px * var(--app-ui-scale,1));line-height:1.05;font-weight:1000;letter-spacing:-.045em}.app-header-brand span{display:block;margin-top:3px;color:var(--muted,#657971);font-size:calc(11px * var(--app-ui-scale,1));font-weight:730;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app-header-tools{display:flex;gap:5px}.app-theme-toggle{width:38px;height:38px;padding:0;display:grid;place-items:center;border:1px solid var(--line,#cbdcd5);border-radius:12px;background:#fff;color:var(--accent-dark,#0d604c);box-shadow:0 6px 16px rgba(20,56,44,.08)}.app-theme-toggle svg{grid-area:1/1;width:18px;height:18px}.app-theme-toggle .theme-icon-sun{display:none}
.app-header-mark{flex:0 0 auto;width:44px;height:44px;display:grid;place-items:center;border-radius:14px;overflow:hidden;background:linear-gradient(145deg,#39ba98,#11765e);color:#fff;font-size:12px;font-weight:1000;box-shadow:0 8px 18px rgba(17,119,93,.18)}.app-header-mark>*{grid-area:1/1}.app-header-mark img{width:100%;height:100%;object-fit:cover}.app-header-mark img:not([hidden])+b{display:none}
.app-content-shell{width:100%!important;max-width:1120px!important;margin:0 auto!important;padding:12px!important}
.app-drawer-veil{position:fixed;inset:0;z-index:998;background:rgba(8,27,21,.46);backdrop-filter:blur(2px);touch-action:none}
.app-drawer{position:fixed;inset:0 auto 0 0;z-index:999;width:min(320px,90vw);height:100dvh;padding:max(20px,env(safe-area-inset-top)) 14px max(12px,env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow:hidden;background:#17312a;color:#fff;box-shadow:18px 0 55px rgba(5,24,18,.3);transform:translate3d(-105%,0,0);visibility:hidden;will-change:transform}
.app-drawer.app-drawer-ready{transition:transform .2s ease,visibility 0s linear .2s}.app-drawer.app-drawer-ready.open{transition-delay:0s;visibility:visible}
.app-drawer.open{transform:translate3d(0,0,0)}.app-drawer-brand{flex:0 0 auto;display:flex;align-items:center;gap:11px;padding:3px 8px 16px}.app-drawer-brand>span{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;overflow:hidden;background:linear-gradient(145deg,#39ba98,#11765e);font-size:12px;font-weight:1000}.app-drawer-brand>span>*{grid-area:1/1}.app-drawer-brand>span img{width:100%;height:100%;object-fit:cover}.app-drawer-brand>span img:not([hidden])+b{display:none}.app-drawer-brand strong{font-size:20px;letter-spacing:-.03em}
.app-drawer-scroll{min-height:0;flex:1;overflow-x:hidden;overflow-y:auto;padding:0 3px 12px;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-padding-block:8px;-webkit-overflow-scrolling:touch}.app-drawer nav{display:grid;gap:5px}.app-drawer nav a,.app-drawer-admin summary{min-height:47px;padding:0 13px;border:0;border-radius:13px;color:#d5e6df;background:transparent;text-decoration:none;font:800 14px/1.2 Inter,system-ui,sans-serif;display:flex;align-items:center;gap:11px;text-align:left}.app-drawer nav a:hover,.app-drawer nav a.active,.app-drawer-admin summary:hover{background:rgba(255,255,255,.1);color:#fff}.app-drawer svg{width:20px;height:20px;flex:0 0 auto}
.app-drawer-admin{margin-top:7px;padding-top:7px;border-top:1px solid rgba(255,255,255,.1)}.app-drawer-admin summary{cursor:pointer;list-style:none}.app-drawer-admin summary::-webkit-details-marker{display:none}.app-drawer-admin summary span{flex:1}.app-drawer-chevron{width:16px!important;height:16px!important;transition:transform .18s ease}.app-drawer-admin[open] .app-drawer-chevron{transform:rotate(180deg)}.app-drawer-admin nav{margin:4px 0 2px 11px;padding-left:7px;border-left:1px solid rgba(255,255,255,.12)}.app-drawer-admin nav a{padding-left:10px;font-size:13px}
.app-drawer-footer{flex:0 0 auto;padding:10px 3px 0;border-top:1px solid rgba(255,255,255,.12)}.app-drawer-account{min-width:0;padding:0 7px 8px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:3px 7px}.app-drawer-account small{color:#9fb7ae;font-size:10px}.app-drawer-account>strong{overflow:hidden;color:#e6f2ed;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.app-drawer-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.app-drawer-actions form{min-width:0;margin:0}.app-drawer-actions :is(button,a){width:100%;min-height:50px;margin:0;padding:5px 3px;border:0;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;background:rgba(255,255,255,.065);color:#cfe1da;text-decoration:none;font:750 10px/1.1 Inter,system-ui,sans-serif;cursor:pointer}.app-drawer-actions :is(button,a):hover,.app-drawer-actions a.active{background:rgba(255,255,255,.12);color:#fff}.app-drawer-actions .app-drawer-source{color:#cfe1da}.app-drawer-actions svg{width:18px;height:18px}.app-drawer-theme .theme-icon-sun{display:none}body[data-theme="dark"] .app-drawer-theme .theme-icon-moon{display:none}body[data-theme="dark"] .app-drawer-theme .theme-icon-sun{display:block}
html{scrollbar-gutter:stable}body.app-drawer-lock{position:fixed;inset-inline:0;width:100%;overflow:hidden;overscroll-behavior:none}
body[data-theme="dark"]{color-scheme:dark;--bg:#0d1512;--bg2:#111a17;--deep:#111a17;--bg-deep:#111a17;--panel:#17211d;--panel-solid:#17211d;--card:#17211d;--surface:#17211d;--surface2:#1b2823;--soft:#1b2823;--text:#eef7f3;--muted:#9fb0aa;--line:#33463e;--line-strong:#40564d;--accent:#56c5a5;--accent2:#299778;--accent-dark:#99e2cd;--accent-soft:#203f35;--shadow:0 16px 42px rgba(0,0,0,.28);background:#0d1512}
body[data-theme="dark"] .app-topbar{background:rgba(16,24,21,.94);border-color:#2b3b35}
body[data-theme="dark"] .app-menu-toggle,body[data-theme="dark"] .app-theme-toggle{background:#18231f;color:var(--text);border-color:var(--line);box-shadow:none}
body[data-theme="dark"] .app-theme-toggle .theme-icon-moon{display:none}body[data-theme="dark"] .app-theme-toggle .theme-icon-sun{display:block}
body[data-theme="dark"] :is(.panel,.card,.intro,.login,.feature,.overview-line,.food,.fav,.listcard,.userCard,.stat,.fact,.link){background:var(--panel)!important;color:var(--text);border-color:var(--line)!important}
body[data-theme="dark"] :is(input,textarea,select,.btn.ghost,.foodactions button,.item){background:#18231f!important;color:var(--text)!important;border-color:var(--line)!important}
body[data-theme="dark"] .overview-warning,body[data-theme="dark"] .warning{background:#302b1d!important;color:#e8d89d;border-color:#655a34!important}
body[data-theme="dark"] :is(.hero,.hero-card,.camera-card,.results-card,.detected-components-card,.estimate-card,.components-card,.sheet,.prediction,.component-ai-item,.manual-item,.portion-quick button,.grams-field>div,.secondary-btn){background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}
body[data-theme="dark"] :is(.portion-block,.tabs){background:var(--surface2)!important;border-color:var(--line)!important}body[data-theme="dark"] .tabs button.active{background:#24322d!important;color:var(--text)!important}
body[data-theme="dark"] :is(.loginCard,.setup-card,.notice){background:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}body[data-theme="dark"] .setup-card p{color:var(--muted)}body[data-theme="dark"] :is(.sheet-head button,.portion-quick button,.prediction,.manual-item){color:var(--text)!important}
body[data-theme="dark"] .ui-dialog-card{background:var(--panel);color:var(--text);border-color:var(--line)}body[data-theme="dark"] .ui-dialog-card p{color:var(--muted)}body[data-theme="dark"] .ui-dialog-actions button{background:#18231f;color:var(--text);border-color:var(--line)}body[data-theme="dark"] .ui-dialog-actions .confirm{background:var(--accent);color:#071b15}body[data-theme="dark"] .ui-dialog-actions .confirm.danger{background:#b94f5d;color:#fff}body[data-theme="dark"] .password-visibility{color:var(--muted)!important}
@media(max-width:430px){.app-topbar{min-height:70px;padding-left:11px;padding-right:11px}.app-menu-toggle,.app-header-mark{width:44px;height:44px;border-radius:14px}.app-header-brand strong{font-size:19px}.app-header-brand span{font-size:10px}}
@media(min-width:700px) and (max-width:899px) and (orientation:portrait){:root{--app-ui-scale:1.16}.app-content-shell{max-width:820px!important;padding:calc(12px * var(--app-ui-scale))!important}}
@media(min-width:900px) and (max-width:1400px) and (orientation:portrait){:root{--app-ui-scale:1.22}.app-content-shell{max-width:940px!important;padding:calc(12px * var(--app-ui-scale))!important}}
@media(min-width:980px) and (orientation:landscape){:root{--app-ui-scale:1}.app-content-shell{padding:18px!important}}
@media(min-width:1100px) and (orientation:landscape){body:has(.app-drawer){padding-left:280px}.app-drawer{width:280px;transform:none;visibility:visible;box-shadow:8px 0 28px rgba(5,24,18,.14);will-change:auto}.app-drawer.app-drawer-ready{transition:none}.app-drawer-veil{display:none!important}.app-menu-toggle{display:none!important}}
@media(prefers-reduced-motion:reduce){.app-drawer,.app-drawer-chevron{transition:none}}