:root{--ink:#17221d;--muted:#6f7b75;--line:#e6e9e7;--paper:#f5f7f5;--white:#fff;--forest:#12372a;--green:#1e6b4c;--lime:#c9e76b;--amber:#e89834;--coral:#e36b56;--blue:#4d78a8;--shadow:0 16px 45px rgba(20,47,36,.08)}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{width:248px;background:var(--forest);color:#fff;position:fixed;inset:0 auto 0 0;padding:27px 18px 18px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;padding:0 8px 27px}.brand-mark{width:38px;height:38px;background:var(--lime);color:var(--forest);display:grid;place-items:center;border-radius:11px;font:800 20px Manrope}.brand strong{font:800 18px Manrope;display:block}.brand span{font-size:11px;color:#9db5aa}.unit-card{border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);padding:17px 7px}.unit-card small,.nav-list p{font-size:9px;letter-spacing:1.2px;color:#7f9b8f;font-weight:700}.unit-selector{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:0;color:#fff;text-align:left;padding:7px 0 0;cursor:pointer}.unit-selector b,.unit-selector em{display:block}.unit-selector b{font-size:14px}.unit-selector em{font-style:normal;font-size:11px;color:#9db5aa;margin-top:2px}.nav-list{display:flex;flex-direction:column;gap:3px;margin-top:17px;overflow:auto}.nav-list p{padding:9px 10px 1px;margin:4px 0}.nav-item{border:0;background:transparent;color:#b8c9c1;border-radius:8px;padding:10px 11px;display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;font-weight:500;font-size:13px;transition:.2s}.nav-item span{width:18px;font-size:17px;text-align:center}.nav-item i{font-style:normal;margin-left:auto;background:#f4a15b;color:#26362f;border-radius:20px;padding:2px 7px;font-size:10px;font-weight:800}.nav-item:hover,.nav-item.active{background:rgba(255,255,255,.09);color:#fff}.sidebar-footer{margin-top:auto}.help-card{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);padding:12px;border-radius:9px;margin-bottom:12px}.help-card>span{border:1px solid #7b998c;width:26px;height:26px;display:grid;place-items:center;border-radius:50%}.help-card b,.help-card small,.user-card b,.user-card small{display:block;font-size:11px}.help-card small,.user-card small{color:#92a99e;margin-top:2px}.user-card{display:flex;align-items:center;gap:9px;border-top:1px solid rgba(255,255,255,.1);padding:15px 3px 0}.avatar{width:34px;height:34px;border-radius:50%;background:#d9e5c1;color:var(--forest);display:grid;place-items:center;font-size:11px;font-weight:800}.user-card button{margin-left:auto;background:0;border:0;color:#9db5aa}.main-content{margin-left:248px;width:calc(100% - 248px);padding:0 36px 45px}.topbar{height:91px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:29px}.topbar-title p{font-size:11px;color:var(--muted);margin:0 0 4px}.topbar-title h1{font:700 20px Manrope;margin:0}.top-actions{display:flex;gap:10px;align-items:center}.icon-btn{border:1px solid var(--line);background:#fff;width:38px;height:38px;border-radius:9px;cursor:pointer}.notification{position:relative}.notification i{position:absolute;width:6px;height:6px;background:var(--coral);border:2px solid white;border-radius:50%;right:8px;top:8px}.primary-btn,.secondary-btn{border:0;padding:11px 16px;border-radius:8px;cursor:pointer;font-weight:700;font-size:12px;transition:.2s}.primary-btn{background:var(--green);color:white;box-shadow:0 5px 13px rgba(30,107,76,.16)}.primary-btn:hover{background:#17583e;transform:translateY(-1px)}.secondary-btn{background:white;color:var(--ink);border:1px solid var(--line)}.mobile-menu{display:none}.page{display:none;animation:fade .25s ease}.page.active{display:block}@keyframes fade{from{opacity:0;transform:translateY(4px)}}.welcome-banner{background:linear-gradient(112deg,#153e30,#235b45);color:white;border-radius:15px;padding:27px 32px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative}.welcome-banner:after{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(255,255,255,.07);border-radius:50%;right:-50px;top:-110px;box-shadow:0 0 0 45px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.02)}.eyebrow{font-size:9px;letter-spacing:1.4px;font-weight:800;color:#7da08f}.welcome-banner .eyebrow{color:var(--lime)}.welcome-banner h2{font:700 23px Manrope;margin:7px 0 6px}.welcome-banner p{color:#b6c9bf;font-size:12px;margin:0}.health-score{display:flex;align-items:center;gap:13px;z-index:1;margin-right:23px}.health-score svg{width:68px;transform:rotate(-90deg)}.health-score circle{fill:none;stroke:rgba(255,255,255,.14);stroke-width:8}.health-score circle.progress{stroke:var(--lime);stroke-dasharray:314;stroke-dashoffset:25;stroke-linecap:round}.health-score b{display:block;font:800 25px Manrope}.health-score small{display:block;color:#b6c9bf;font-size:9px;width:60px}.section-heading,.page-heading{display:flex;align-items:end;justify-content:space-between}.section-heading{margin:27px 1px 14px}.section-heading h3,.panel h3{font:700 15px Manrope;margin:0}.section-heading p,.panel p{font-size:10px;color:var(--muted);margin:4px 0 0}.text-btn{border:0;background:0;color:var(--green);font-size:11px;font-weight:700;cursor:pointer}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.metric-card{background:white;border:1px solid var(--line);padding:17px;border-radius:11px;display:flex;align-items:center;gap:13px}.metric-card>button{border:0;background:0;color:#9aa49f;margin-left:auto}.metric-icon{width:40px;height:40px;border-radius:9px;display:grid;place-items:center;font-size:18px}.metric-icon.green{background:#e7f3ed;color:var(--green)}.metric-icon.amber{background:#fff3e5;color:var(--amber)}.metric-icon.blue{background:#eaf1f8;color:var(--blue)}.metric-icon.coral{background:#fcece8;color:var(--coral)}.metric-copy span,.metric-copy b,.metric-copy small{display:block}.metric-copy span{font-size:10px;color:var(--muted)}.metric-copy b{font:800 21px Manrope;margin:2px 0}.metric-copy small{font-size:9px;color:var(--muted)}.positive{color:var(--green)!important}.warning{color:#b86922!important}.dashboard-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin-top:14px}.panel{background:white;border:1px solid var(--line);border-radius:11px;padding:19px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start}.panel-head select{border:1px solid var(--line);padding:7px 9px;border-radius:7px;color:var(--muted);font-size:10px;background:white}.chart-legend{display:flex;gap:15px;justify-content:flex-end;font-size:9px;color:var(--muted);margin-top:10px}.chart-legend i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px}.legend-in{background:var(--green)}.legend-out{background:#cde3a1}.chart-wrap{height:170px;display:flex;margin-top:5px}.y-labels{font-size:8px;color:#a4aca8;display:flex;flex-direction:column;justify-content:space-between;padding:2px 12px 22px 0}.bar-chart{flex:1;border-left:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:flex-end;justify-content:space-around;background:repeating-linear-gradient(to bottom,transparent 0,transparent 48px,#eef0ef 49px)}.bar-group{width:11%;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.bar-group>div{height:calc(100% - 23px);display:flex;gap:3px;align-items:flex-end}.bar-group i,.bar-group b{display:block;width:10px;border-radius:3px 3px 0 0}.bar-group i{background:var(--green)}.bar-group b{background:#cde3a1}.bar-group span{height:22px;font-size:8px;color:#8b9690;margin-top:5px}.bar-group.faded{opacity:.45}.expiry-list{margin-top:13px}.expiry-item{display:flex;align-items:center;gap:9px;padding:10px 0;border-top:1px solid #eff1ef}.food-thumb{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;background:#f5efe8}.expiry-item div:nth-child(2){min-width:0;flex:1}.expiry-item b,.expiry-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.expiry-item b{font-size:10px}.expiry-item small{font-size:8px;color:var(--muted);margin-top:3px}.tag{font-size:8px;font-weight:700;padding:4px 7px;border-radius:20px;white-space:nowrap}.tag.danger{background:#fbe9e5;color:#bd4f3c}.tag.amber{background:#fff1df;color:#b9681d}.spaced{margin-bottom:12px}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.quick-card{display:flex;align-items:center;text-align:left;gap:12px;background:white;border:1px solid var(--line);border-radius:10px;padding:14px;cursor:pointer;transition:.2s}.quick-card:hover{border-color:#bbd4c8;transform:translateY(-2px);box-shadow:var(--shadow)}.quick-icon{width:35px;height:35px;display:grid;place-items:center;background:#edf4ef;color:var(--green);border-radius:8px}.quick-card div{flex:1}.quick-card b,.quick-card small{display:block}.quick-card b{font-size:11px}.quick-card small{font-size:9px;color:var(--muted);margin-top:3px}.quick-card>i{font-style:normal;color:var(--green)}.page-heading{margin:5px 0 24px}.page-heading h2{font:800 25px Manrope;margin:5px 0}.page-heading p{font-size:12px;color:var(--muted);margin:0}.toolbar{display:flex;gap:10px;margin-bottom:14px}.search-field{flex:1;background:#fff;border:1px solid var(--line);border-radius:8px;padding:0 13px;color:#9aa49f;display:flex;align-items:center;gap:7px}.search-field input{border:0;outline:0;padding:11px 0;flex:1;font-size:11px}.toolbar select{border:1px solid var(--line);border-radius:8px;background:#fff;padding:0 13px;color:var(--muted);font-size:11px}.table-card{background:#fff;border:1px solid var(--line);border-radius:11px;overflow:hidden}.table-card table{width:100%;border-collapse:collapse}.table-card th{text-align:left;background:#fafbfa;color:#7e8983;font-size:9px;text-transform:uppercase;letter-spacing:.5px;padding:12px 16px}.table-card td{font-size:11px;padding:13px 16px;border-top:1px solid #eef0ef;color:#47524c}.product-cell{display:flex;align-items:center;gap:10px}.product-cell>span{width:34px;height:34px;border-radius:8px;background:#f3f5f3;display:grid;place-items:center}.product-cell b,.product-cell small{display:block}.product-cell b{color:var(--ink)}.product-cell small{font-size:8px;color:#929b97;margin-top:2px}.status{font-style:normal;font-size:9px;padding:4px 8px;border-radius:20px}.status.active{background:#e8f4ee;color:var(--green)}.status.paused{background:#f0f1f0;color:#7e8983}.status.review{background:#fff0df;color:#a95c16}.table-footer{padding:12px 16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:9px;color:var(--muted)}.table-footer button{border:1px solid var(--line);background:white;border-radius:5px;margin-left:4px;font-size:9px;width:25px;height:25px}.table-footer button.current{background:var(--green);color:white}.metric-grid.compact{grid-template-columns:repeat(3,1fr);margin-bottom:15px}.compact .metric-card{min-height:95px}.expiry-tabs{display:flex;gap:5px;margin-bottom:13px}.expiry-tabs button{background:transparent;border:0;padding:9px 12px;font-size:10px;color:var(--muted);border-radius:7px}.expiry-tabs button.active{background:white;color:var(--green);font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.04)}.expiry-tabs span{background:#e8ecea;border-radius:12px;padding:2px 6px;margin-left:3px}.mini-btn{border:1px solid var(--line);background:white;border-radius:6px;font-size:9px;padding:6px 9px}.label-layout{display:grid;grid-template-columns:270px 1fr;gap:14px}.label-templates{display:flex;flex-direction:column;gap:10px}.template-card{background:white;border:1px solid var(--line);border-radius:10px;padding:11px;display:grid;grid-template-columns:85px 1fr auto;align-items:center;gap:11px;cursor:pointer}.template-card.selected{border:2px solid var(--green);padding:10px}.template-preview{background:#fff;border:1px solid #bbb;color:#111;width:75px;height:50px;padding:5px;position:relative;overflow:hidden}.template-preview b,.template-preview span{display:block;font-family:Arial}.template-preview b{font-size:6px}.template-preview span{font-size:4px;margin-top:3px}.template-preview i{position:absolute;right:4px;bottom:3px;font-style:normal;font-size:13px}.template-card>div:nth-child(2) b,.template-card>div:nth-child(2) small{display:block}.template-card>div:nth-child(2) b{font-size:10px}.template-card>div:nth-child(2) small{font-size:8px;color:var(--muted);margin-top:4px}.template-card>button{border:0;background:0}.editor-panel{background:white;border:1px solid var(--line);border-radius:11px;padding:20px}.printer-pill{font-size:8px;color:var(--green);background:#eaf4ef;border-radius:20px;padding:5px 9px}.editor-grid{display:grid;grid-template-columns:280px 1fr;gap:30px;margin-top:21px}.label-settings label,.modal label{display:block;font-size:9px;font-weight:700;color:#55615b;margin-bottom:12px}.label-settings input,.label-settings select,.modal input,.modal select,.modal textarea{display:block;width:100%;border:1px solid var(--line);border-radius:7px;padding:9px;margin-top:5px;background:white;font-size:10px;outline:none}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.label-settings fieldset{border:0;padding:0;margin:9px 0 16px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.label-settings legend{font-size:9px;font-weight:700;margin-bottom:9px}.label-settings fieldset label{font-weight:500;margin:0;display:flex;align-items:center;gap:6px}.label-settings fieldset input{width:auto;margin:0;accent-color:var(--green)}.editor-actions{display:flex;gap:8px}.label-stage{background:#f1f3f1;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:390px}.label-stage>span{font-size:8px;letter-spacing:1px;color:#8a958f;margin-bottom:20px}.label-stage>small{font-size:8px;color:#8a958f;margin-top:15px}.real-label{width:300px;height:200px;background:#fff;border:1px solid #777;box-shadow:0 13px 30px rgba(0,0,0,.12);padding:13px;color:#000;font-family:Arial;position:relative}.label-company{font-size:8px;border-bottom:1px solid #111;padding-bottom:5px;margin-bottom:7px}.real-label>b{display:block;font-size:15px;margin-bottom:11px}.preview-dates{display:flex;gap:15px}.preview-dates span{font-size:7px}.preview-dates strong{display:block;font-size:10px;margin-top:3px}.real-label>small{display:block;font-size:7px;margin-top:6px}.real-label .qr{position:absolute;right:13px;bottom:15px;font-size:48px;line-height:1}.real-label em{font-size:6px;position:absolute;bottom:7px;left:13px;font-style:normal}.hidden-field{display:none!important}.placeholder-page{min-height:70vh}.empty-state{background:white;border:1px solid var(--line);border-radius:15px;min-height:500px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.empty-state>span{width:65px;height:65px;border-radius:18px;background:#eaf3ee;color:var(--green);font-size:28px;display:grid;place-items:center}.empty-state h2{font:700 22px Manrope;margin:18px 0 7px}.empty-state p{font-size:12px;color:var(--muted);margin:0 0 20px}.modal-backdrop{position:fixed;inset:0;background:rgba(10,25,19,.55);display:none;align-items:center;justify-content:center;z-index:50;backdrop-filter:blur(3px)}.modal-backdrop.open{display:flex}.modal{width:440px;background:white;border-radius:15px;padding:28px;position:relative;box-shadow:0 30px 90px rgba(0,0,0,.25);animation:modalIn .2s ease}@keyframes modalIn{from{transform:translateY(12px);opacity:0}}.modal-close{position:absolute;right:17px;top:14px;border:0;background:0;font-size:23px;color:#8b9590;cursor:pointer}.modal-icon{width:42px;height:42px;background:#e8f3ed;color:var(--green);display:grid;place-items:center;border-radius:10px;font-size:20px}.modal h2{font:800 20px Manrope;margin:14px 0 5px}.modal>p{font-size:11px;color:var(--muted);margin:0 0 22px}.modal textarea{min-height:72px;resize:vertical}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.unit-popover{display:none;position:fixed;left:22px;top:135px;width:210px;background:white;border-radius:9px;z-index:40;padding:9px;box-shadow:0 14px 50px rgba(0,0,0,.22);color:var(--ink)}.unit-popover.open{display:block}.unit-popover small{font-size:8px;color:var(--muted);padding:7px}.unit-popover button{display:flex;justify-content:space-between;width:100%;border:0;background:0;padding:9px 7px;font-size:10px;text-align:left;border-radius:6px}.unit-popover button:hover,.unit-popover button.active{background:#edf4f0;color:var(--green)}.unit-popover hr{border:0;border-top:1px solid var(--line)}.toast{position:fixed;right:25px;bottom:25px;background:var(--forest);color:white;border-radius:10px;padding:13px 17px;display:flex;align-items:center;gap:11px;transform:translateY(100px);opacity:0;transition:.3s;z-index:70;box-shadow:var(--shadow)}.toast.show{transform:translateY(0);opacity:1}.toast>span{width:25px;height:25px;border-radius:50%;background:var(--lime);color:var(--forest);display:grid;place-items:center;font-weight:800}.toast b,.toast small{display:block}.toast b{font-size:10px}.toast small{font-size:8px;color:#aec3b9;margin-top:2px}
@media(max-width:1050px){.metric-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.label-layout{grid-template-columns:1fr}.label-templates{display:grid;grid-template-columns:repeat(3,1fr)}.template-card{grid-template-columns:75px 1fr}.template-card>button{display:none}}@media(max-width:780px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:translateX(0)}.main-content{margin-left:0;width:100%;padding:0 18px 35px}.mobile-menu{display:block;border:0;background:0;font-size:20px}.topbar{height:75px;margin-bottom:20px}.topbar-title p{display:none}.quick-action{display:none}.welcome-banner{padding:22px}.health-score{display:none}.quick-grid,.label-templates{grid-template-columns:1fr}.table-card{overflow-x:auto}.table-card table{min-width:720px}.editor-grid{grid-template-columns:1fr}.label-stage{min-height:300px}.page-heading{align-items:flex-start}.page-heading p{max-width:390px}.unit-popover{left:15px}.toolbar{flex-wrap:wrap}.search-field{flex-basis:100%}}@media(max-width:520px){.metric-grid,.metric-grid.compact{grid-template-columns:1fr}.top-actions .icon-btn:first-child{display:none}.welcome-banner h2{font-size:19px}.page-heading{display:block}.page-heading button{margin-top:15px}.label-stage{overflow:auto}.real-label{transform:scale(.82)}.modal{width:calc(100% - 24px);padding:22px}.field-row{grid-template-columns:1fr}.expiry-tabs{overflow:auto}.label-settings fieldset{grid-template-columns:1fr 1fr}}