:root{--green-950:#0d2f1a;--green-900:#123c22;--green-800:#174b2a;--green-700:#1f6337;--green-600:#2b7b45;--lime:#9dcc3d;--orange:#f08a24;--orange-dark:#d96d0d;--red:#d64545;--yellow:#e5a900;--ink:#17211b;--muted:#657169;--line:#dce4dd;--surface:#fff;--bg:#f2f5f1;--shadow:0 12px 30px rgba(20,58,32,.09);--radius:14px;--top-h:74px}
*{box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--ink);min-width:320px}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}svg{width:20px;height:20px;stroke-width:2}.login-screen{min-height:100vh;display:grid;grid-template-columns:minmax(380px,1.1fr) minmax(430px,.9fr);background:#fff}.login-art{position:relative;overflow:hidden;padding:72px;background:radial-gradient(circle at 23% 16%,rgba(157,204,61,.26),transparent 30%),linear-gradient(145deg,var(--green-950),var(--green-700));display:flex;align-items:flex-end}.login-art:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px}.produce-orbit{position:absolute;border:1px solid rgba(255,255,255,.16);border-radius:50%}.produce-orbit:before,.produce-orbit:after{content:"";position:absolute;border-radius:50%;background:var(--orange);box-shadow:0 0 50px rgba(240,138,36,.35)}.produce-orbit-a{width:520px;height:520px;right:-100px;top:-160px}.produce-orbit-a:before{width:112px;height:112px;left:80px;bottom:10px}.produce-orbit-a:after{width:74px;height:74px;right:45px;top:140px;background:var(--lime)}.produce-orbit-b{width:280px;height:280px;left:-80px;top:80px}.produce-orbit-b:before{width:44px;height:44px;right:18px;bottom:45px;background:#c73434}.login-brand-copy{position:relative;z-index:2;max-width:670px;color:#fff}.eyebrow{font-weight:800;letter-spacing:.15em;font-size:.78rem;color:#c7ed7b}.login-brand-copy h1{font:800 clamp(2.3rem,4.6vw,4.8rem)/1.03 Manrope,sans-serif;margin:20px 0}.login-brand-copy p{font-size:1.08rem;line-height:1.7;color:#dbe9de;max-width:540px}.login-panel{display:grid;place-items:center;padding:48px}.login-card{width:min(420px,100%);display:grid;gap:18px}.login-logo{width:118px;height:118px;border-radius:28px;object-fit:cover;box-shadow:var(--shadow);margin-bottom:6px}.login-heading h2{font:800 2rem/1.1 Manrope,sans-serif;margin:14px 0 8px}.login-heading p{margin:0;color:var(--muted)}.status-pill{display:inline-flex;align-items:center;gap:7px;background:#eaf5e7;color:var(--green-700);padding:7px 10px;border-radius:999px;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.status-pill span,.online-chip span{width:8px;height:8px;border-radius:50%;background:#42a95f;box-shadow:0 0 0 4px rgba(66,169,95,.14)}label{display:grid;gap:8px;font-size:.88rem;font-weight:700}.input-shell{height:50px;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;gap:10px;padding:0 14px;background:#fff;transition:.2s}.input-shell:focus-within{border-color:var(--green-600);box-shadow:0 0 0 4px rgba(43,123,69,.1)}.input-shell svg{color:#819087}.input-shell input{border:0;outline:0;flex:1;min-width:0;background:transparent}.btn{border:0;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:800;padding:11px 16px;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn-primary{color:#fff;background:linear-gradient(135deg,var(--green-700),var(--green-900));box-shadow:0 8px 18px rgba(23,75,42,.18)}.btn-orange{background:var(--orange);color:#fff}.btn-soft{background:#edf2ed;color:var(--green-800)}.btn-danger{background:#fdecec;color:#b02f2f}.btn-lg{height:52px}.link-btn{background:none;border:0;color:var(--green-700);font-weight:700}.login-card footer{text-align:center;color:#89938c;font-size:.78rem;margin-top:14px}.login-card footer a,.app-footer a{color:var(--green-700);font-weight:800;text-decoration:none}.form-error{margin:0;color:#b02f2f;background:#fff0f0;border:1px solid #f6cccc;border-radius:10px;padding:11px;font-size:.84rem}.icon-btn{width:42px;height:42px;border:1px solid var(--line);background:#fff;border-radius:11px;display:grid;place-items:center;color:#46534b;position:relative}.icon-btn.inline{border:0;width:32px;height:32px;background:transparent}.app-shell{min-height:100vh;padding-top:calc(var(--top-h) + 47px)}.topbar{position:fixed;z-index:50;top:0;left:0;right:0;height:var(--top-h);background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 22px;gap:22px}.brand-unit{display:flex;align-items:center;gap:11px;min-width:202px}.top-logo{width:48px;height:48px;border-radius:12px;object-fit:cover}.brand-unit strong{font:800 .92rem Manrope,sans-serif;display:block}.brand-unit small{font-size:.7rem;color:var(--muted)}.main-nav{display:flex;align-self:stretch;align-items:stretch;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}.nav-item{border:0;background:transparent;padding:0 12px;min-width:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#5c6860;font-size:.7rem;font-weight:700;position:relative;white-space:nowrap}.nav-item svg{width:22px;height:22px}.nav-item:after{content:"";position:absolute;bottom:0;height:3px;left:15px;right:15px;border-radius:6px 6px 0 0;background:transparent}.nav-item.active{color:var(--green-700)}.nav-item.active:after{background:var(--lime)}.top-actions{display:flex;align-items:center;gap:8px}.notification-btn span{position:absolute;right:-4px;top:-5px;background:var(--red);color:#fff;border:2px solid #fff;border-radius:999px;font-size:.64rem;min-width:20px;height:20px;display:grid;place-items:center;font-weight:800}.online-chip{display:flex;align-items:center;gap:8px;font-size:.72rem;color:var(--green-700);padding:0 9px}.user-menu{height:48px;border:0;background:#f3f6f2;border-radius:12px;padding:5px 8px;display:flex;align-items:center;gap:8px}.user-avatar{width:35px;height:35px;border-radius:10px;background:var(--green-800);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.78rem}.user-text{text-align:left}.user-text strong,.user-text small{display:block}.user-text strong{font-size:.78rem}.user-text small{font-size:.66rem;color:var(--muted);margin-top:2px}.context-row{position:fixed;z-index:45;top:var(--top-h);left:0;right:0;height:47px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 25px;gap:16px}.context-nav{display:flex;align-items:center;gap:5px;overflow-x:auto;flex:1;scrollbar-width:none}.context-link{border:0;background:transparent;border-radius:8px;padding:7px 11px;font-size:.76rem;font-weight:700;color:#67726b;white-space:nowrap}.context-link.active{background:#eaf3e8;color:var(--green-800)}.clock{font-size:.72rem;color:var(--muted);white-space:nowrap}#main-content{max-width:1600px;margin:0 auto;padding:24px 26px 32px;min-height:calc(100vh - 164px);outline:0}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:20px}.page-head h1{font:800 clamp(1.4rem,2.1vw,2rem)/1.1 Manrope,sans-serif;margin:0 0 6px}.page-head p{margin:0;color:var(--muted);font-size:.88rem}.head-actions{display:flex;gap:8px;flex-wrap:wrap}.kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:13px;margin-bottom:18px}.kpi-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:17px;position:relative;overflow:hidden}.kpi-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,var(--green-600))}.kpi-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:.74rem;font-weight:700}.kpi-icon{width:38px;height:38px;border-radius:10px;background:color-mix(in srgb,var(--accent,var(--green-600)) 12%,white);color:var(--accent,var(--green-600));display:grid;place-items:center}.kpi-value{font:800 1.55rem/1 Manrope,sans-serif;margin:15px 0 9px}.kpi-foot{font-size:.7rem;color:var(--muted)}.kpi-foot strong{color:var(--green-600)}.dashboard-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:16px}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 5px 16px rgba(21,50,29,.035)}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #edf1ed}.panel-head h2{font:800 1rem Manrope,sans-serif;margin:0}.panel-head small{color:var(--muted)}.panel-body{padding:17px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quick-action{border:1px solid var(--line);border-radius:12px;background:#fff;padding:15px 8px;display:grid;place-items:center;text-align:center;gap:8px;color:#415047;font-size:.72rem;font-weight:800}.quick-action:hover{border-color:#a9c5ae;background:#f7faf6}.quick-action .quick-icon{width:42px;height:42px;border-radius:12px;background:#edf5eb;color:var(--green-700);display:grid;place-items:center}.alert-list{display:grid;gap:8px}.alert-row{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--line);border-radius:11px;padding:11px}.alert-dot{width:9px;height:9px;border-radius:50%;background:var(--tone,var(--yellow));margin-top:5px;flex:0 0 auto}.alert-row strong{font-size:.78rem;display:block}.alert-row p{font-size:.7rem;color:var(--muted);margin:4px 0 0}.chart-wrap{height:250px;display:flex;align-items:flex-end;gap:10px;padding-top:18px;border-bottom:1px solid var(--line);position:relative}.bar-group{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center;gap:4px;position:relative}.chart-bar{width:13px;max-width:18px;background:linear-gradient(var(--lime),var(--green-600));border-radius:6px 6px 0 0;min-height:6px}.bar-group span{position:absolute;bottom:-23px;font-size:.62rem;color:var(--muted)}.product-grid{display:grid;grid-template-columns:repeat(5,minmax(155px,1fr));gap:12px}.product-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;display:flex;flex-direction:column;min-height:235px;position:relative;transition:.18s}.product-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#b7cbb9}.product-image{height:103px;display:grid;place-items:center;background:linear-gradient(145deg,#f7faf6,#fff);border-radius:11px;margin-bottom:10px}.product-image img{max-width:112px;max-height:96px;object-fit:contain}.product-code{font-size:.62rem;color:#829087}.product-card h3{font-size:.82rem;line-height:1.35;margin:5px 0 8px;min-height:35px}.product-meta{display:flex;justify-content:space-between;gap:6px;color:var(--muted);font-size:.66rem;margin-top:auto}.product-price{font:800 1rem Manrope,sans-serif;margin-top:8px;color:var(--green-800)}.product-add{position:absolute;right:10px;bottom:10px;width:34px;height:34px;border-radius:10px;border:0;background:var(--green-800);color:#fff;display:grid;place-items:center}.toolbar{display:flex;gap:9px;align-items:center;margin-bottom:15px;flex-wrap:wrap}.search-box{flex:1;min-width:220px;display:flex;align-items:center;gap:8px;height:43px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:0 12px}.search-box input{border:0;outline:0;flex:1;background:transparent}.select-control{height:43px;border:1px solid var(--line);background:#fff;border-radius:11px;padding:0 12px;color:#4e5b52}.data-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:13px;background:#fff}.data-table{width:100%;border-collapse:collapse;min-width:820px}.data-table th,.data-table td{padding:12px 14px;text-align:left;border-bottom:1px solid #edf1ed;font-size:.76rem}.data-table th{background:#f7f9f6;color:#5d6961;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em}.data-table tr:last-child td{border-bottom:0}.data-table td strong{display:block}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 8px;font-size:.65rem;font-weight:800;background:#edf2ed;color:#526057}.badge.success{background:#e7f5e9;color:#23713b}.badge.warning{background:#fff5d9;color:#967000}.badge.danger{background:#fde9e9;color:#b53434}.badge.info{background:#e8f1fb;color:#25639c}.abc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.abc-card{border-radius:16px;padding:20px;color:#fff;min-height:180px;position:relative;overflow:hidden}.abc-card:after{content:attr(data-letter);position:absolute;right:-10px;bottom:-40px;font:900 10rem Manrope,sans-serif;color:rgba(255,255,255,.11)}.abc-a{background:linear-gradient(135deg,#174b2a,#2f8050)}.abc-b{background:linear-gradient(135deg,#db791c,#f3a248)}.abc-c{background:linear-gradient(135deg,#52606d,#7d8a96)}.abc-card h3{margin:0;font-size:.88rem}.abc-card strong{font:800 2rem Manrope,sans-serif;display:block;margin:16px 0 4px}.abc-card p{margin:0;font-size:.74rem;color:rgba(255,255,255,.78);max-width:70%}.empty-state{text-align:center;padding:50px 20px;color:var(--muted)}.empty-state svg{width:42px;height:42px;margin-bottom:10px}.modal-backdrop{position:fixed;z-index:100;inset:0;background:rgba(10,25,15,.56);backdrop-filter:blur(4px);display:grid;place-items:center;padding:18px}.modal{background:#fff;border-radius:18px;width:min(760px,100%);max-height:90vh;overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.25)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}.modal-head h2{margin:0;font:800 1.12rem Manrope,sans-serif}.modal-body{padding:20px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.form-field{display:grid;gap:7px}.form-field.full{grid-column:1/-1}.form-field input,.form-field select,.form-field textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px;outline:0;background:#fff}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--green-600);box-shadow:0 0 0 3px rgba(43,123,69,.1)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:16px 20px;border-top:1px solid var(--line)}.toast-region{position:fixed;z-index:200;right:18px;top:18px;display:grid;gap:9px}.toast{background:#fff;border:1px solid var(--line);border-left:4px solid var(--green-600);box-shadow:var(--shadow);border-radius:11px;padding:12px 15px;width:min(360px,calc(100vw - 36px));font-size:.78rem;animation:toast-in .25s ease}.toast.error{border-left-color:var(--red)}@keyframes toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.app-footer{display:flex;justify-content:space-between;gap:15px;padding:18px 27px;border-top:1px solid var(--line);color:#7a867e;font-size:.68rem}.floating-sale{display:none}.skeleton{background:linear-gradient(90deg,#eef1ed,#f8faf7,#eef1ed);background-size:200% 100%;animation:shimmer 1.3s infinite}@keyframes shimmer{to{background-position:-200% 0}}
@media(max-width:1250px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.product-grid{grid-template-columns:repeat(4,1fr)}.user-text,.online-chip{display:none}.brand-unit{min-width:175px}.nav-item{padding:0 8px;min-width:67px}}
@media(max-width:930px){:root{--top-h:66px}.login-screen{grid-template-columns:1fr}.login-art{display:none}.login-panel{min-height:100vh;padding:25px}.topbar{padding:0 12px;gap:8px}.brand-unit{min-width:auto}.brand-unit div{display:none}.top-logo{width:43px;height:43px}.top-actions .search-trigger,.online-chip{display:none}.user-menu{background:transparent;padding:0}.user-menu>svg,.user-text{display:none}.main-nav{order:3}.context-row{padding:0 12px}.clock{display:none}#main-content{padding:18px 14px 88px}.kpi-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.product-grid{grid-template-columns:repeat(3,1fr)}.abc-grid{grid-template-columns:1fr}.floating-sale{position:fixed;z-index:60;right:17px;bottom:18px;border:0;border-radius:999px;background:var(--orange);color:#fff;padding:13px 18px;display:flex;align-items:center;gap:8px;font-weight:800;box-shadow:0 12px 24px rgba(217,109,13,.32)}.app-footer{padding-bottom:85px}}
@media(max-width:620px){.app-shell{padding-top:calc(var(--top-h) + 45px)}.topbar{align-items:center}.main-nav{gap:0}.nav-item{min-width:62px;padding:0 6px;font-size:.6rem}.nav-item svg{width:20px;height:20px}.top-actions{gap:4px}.icon-btn{width:38px;height:38px}.notification-btn{display:none}.page-head{display:grid}.head-actions{width:100%}.head-actions .btn{flex:1}.kpi-grid{gap:9px}.kpi-card{padding:14px}.kpi-value{font-size:1.25rem}.kpi-grid .kpi-card:nth-child(n+5){display:none}.quick-grid{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.product-card{min-height:225px;padding:10px}.product-image{height:94px}.product-image img{max-width:96px;max-height:88px}.product-card h3{font-size:.75rem}.toolbar .btn{width:100%}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}.app-footer{display:grid;text-align:center}.modal-backdrop{padding:8px}.modal{border-radius:14px}.abc-card{min-height:155px}}
.btn-install{height:50px;background:#fff;color:var(--green-800);border:1px solid #b9cebc}.btn-install:hover{background:#eff7ec}.install-trigger{color:var(--green-700);border-color:#b9cebc;background:#f4faf2}