:root{--green: #0a7d3c;--green-dark: #075c2c;--green-deep: #05421f;--green-soft: #e6f4ec;--yellow: #ffce00;--red: #e8112d;--ink: #12211a;--muted: #6b7c73;--line: #e7ede9;--bg: #f6f8f7;--card: #ffffff;--shadow: 0 6px 20px rgba(12, 40, 25, .08);--shadow-soft: 0 2px 10px rgba(12, 40, 25, .06);--radius: 16px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--sidebar-w: 252px;--content-w: 1120px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font-family:inherit}.app-shell{max-width:460px;margin:0 auto;min-height:100%;background:var(--bg);position:relative;display:flex;flex-direction:column;box-shadow:0 0 60px #0000000f}.screen{flex:1;width:100%;padding:calc(14px + var(--safe-top)) 16px 96px;animation:fade .25s ease}@keyframes fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(12px + var(--safe-top)) 16px 12px;background:var(--green);color:#fff;box-shadow:var(--shadow)}.topbar h1{font-size:18px;margin:0;font-weight:700;letter-spacing:.2px}.topbar .sub{font-size:12px;opacity:.85;margin:0}.topbar .back{background:#ffffff2e;border:none;color:#fff;width:34px;height:34px;border-radius:10px;font-size:18px;cursor:pointer}.topbar .spacer{flex:1}.topbar .pill{background:#ffffff29;border:none;color:inherit;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer}.tabbar{position:sticky;bottom:0;z-index:20;display:flex;background:var(--card);border-top:1px solid var(--line);padding:8px 6px calc(8px + var(--safe-bottom))}.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--muted);padding:4px 0;font-weight:600;border-radius:10px}.tabbar a.active{color:var(--green)}.tabbar .ic{font-size:20px;display:grid;place-items:center}.tabbar .brand,.tabbar .side-foot,.tabbar .side-logout{display:none}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-soft);border:1px solid var(--line);padding:14px;margin-bottom:12px}.section-title{display:flex;align-items:center;gap:8px;font-size:13px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin:18px 2px 8px;font-weight:700}.section-title:before{content:"";width:16px;height:3px;border-radius:2px;background:var(--green);flex-shrink:0}.store-card{display:flex;gap:12px;align-items:center;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.store-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.store-logo{width:58px;height:58px;border-radius:14px;display:grid;place-items:center;font-size:26px;color:#fff;flex-shrink:0}.store-card h3{margin:0 0 2px;font-size:16px}.store-card .meta{font-size:12px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap}.badge{background:var(--green-soft);color:var(--green-dark);font-size:11px;padding:3px 8px;border-radius:999px;font-weight:700}.badge.gray{background:#eef1f0;color:var(--muted)}.badge.red{background:#fdeaec;color:var(--red)}.badge.yellow{background:#fff7d6;color:#8a6d00}.grid-cards{display:grid;grid-template-columns:1fr;gap:12px}.grid-cards>.card{margin-bottom:0}.product{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.product:last-child{border-bottom:none}.product .thumb{width:52px;height:52px;border-radius:12px;background:var(--green-soft);display:grid;place-items:center;font-size:24px;flex-shrink:0}.product .info{flex:1;min-width:0}.product .info h4{margin:0;font-size:15px}.product .info .price{color:var(--green-dark);font-weight:700;font-size:14px}.product .info .stock{font-size:11px;color:var(--muted)}.product .info .stock.low{color:var(--red);font-weight:600}.stepper{display:flex;align-items:center;gap:8px}.stepper button{width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:18px;line-height:1;cursor:pointer;color:var(--green-dark)}.stepper button:disabled{opacity:.4;cursor:not-allowed}.stepper .n{min-width:20px;text-align:center;font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;border-radius:14px;border:none;background:var(--green);color:#fff;font-size:15px;font-weight:700;cursor:pointer;transition:transform .05s ease,background .2s,box-shadow .2s}.btn:hover{box-shadow:0 4px 14px #0a7d3c40}.btn:active{transform:scale(.99)}.btn:disabled{background:#b7c9bf;cursor:not-allowed;box-shadow:none}.btn.outline{background:#fff;color:var(--green-dark);border:1.5px solid var(--green)}.btn.ghost{background:var(--green-soft);color:var(--green-dark)}.btn.danger{background:var(--red)}.btn.small{width:auto;padding:9px 14px;font-size:13px;border-radius:10px}.btn.yellow{background:var(--yellow);color:#4a3b00}label.field{display:block;margin-bottom:12px}label.field span{display:block;font-size:12px;color:var(--muted);margin-bottom:5px;font-weight:600}input,select,textarea{width:100%;padding:12px;border:1px solid var(--line);border-radius:12px;font-size:15px;background:#fff;color:var(--ink)}input:focus,select:focus,textarea:focus{outline:2px solid var(--green);border-color:transparent}.row{display:flex;gap:10px}.row>*{flex:1}.footer-bar{position:sticky;bottom:0;z-index:15;background:var(--card);border-top:1px solid var(--line);padding:12px 16px calc(12px + var(--safe-bottom));box-shadow:0 -6px 20px #0c28190f}.cart-fab{position:fixed;left:50%;transform:translate(-50%);bottom:calc(16px + var(--safe-bottom));width:min(430px,calc(100% - 32px));z-index:30}.timeline{list-style:none;padding:0;margin:0}.timeline li{display:flex;gap:12px;padding-bottom:16px;position:relative}.timeline li:not(:last-child):before{content:"";position:absolute;left:11px;top:24px;bottom:0;width:2px;background:var(--line)}.timeline .dot{width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid var(--line);display:grid;place-items:center;flex-shrink:0;font-size:12px;z-index:1}.timeline li.done .dot{background:var(--green);border-color:var(--green);color:#fff}.timeline li.current .dot{border-color:var(--green);color:var(--green);animation:pulse 1.4s infinite}.timeline .t-label{font-weight:700;font-size:14px}.timeline .t-time{font-size:12px;color:var(--muted)}@keyframes pulse{0%,to{box-shadow:0 0 #0a7d3c66}50%{box-shadow:0 0 0 6px #0a7d3c00}}.map-wrap{position:relative;height:300px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#dfe7e2}.map-wrap.tall{height:42vh;min-height:280px}.map-el{width:100%;height:100%}.eta-chip{position:absolute;top:12px;left:12px;z-index:5;background:#fffffff2;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:8px 12px;border-radius:12px;box-shadow:var(--shadow);font-size:13px}.eta-chip b{color:var(--green-dark);font-size:16px}.fallback-map{width:100%;height:100%;display:block;background:linear-gradient(180deg,#e9f1ec,#dfe9e3)}.hero{min-height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:calc(40px + var(--safe-top)) 24px calc(28px + var(--safe-bottom));background:radial-gradient(120% 60% at 50% 0%,#0d914659 0%,transparent 60%),linear-gradient(180deg,var(--green-dark),var(--green));color:#fff}.hero .logo{font-size:44px}.hero h1{font-size:30px;margin:14px 0 6px}.hero p.tag{opacity:.9;font-size:15px;margin:0;max-width:460px;line-height:1.5}.hero .hero-points{display:none}.role-btn{display:flex;align-items:center;gap:14px;width:100%;background:#ffffff1f;border:1px solid rgba(255,255,255,.2);color:#fff;padding:16px;border-radius:16px;margin-bottom:12px;cursor:pointer;text-align:left;transition:background .15s ease,transform .12s ease}.role-btn:hover{background:#fff3;transform:translateY(-2px)}.role-btn .ic{font-size:26px}.role-btn h3{margin:0;font-size:16px}.role-btn p{margin:2px 0 0;font-size:12px;opacity:.85}.onboard-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#0620119e;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px;animation:fade .25s ease}.onboard-card{background:var(--card);border-radius:22px;box-shadow:0 24px 70px #00000059;padding:30px 26px 22px;width:min(440px,100%);text-align:center}.onboard-ic{font-size:52px}.onboard-card h2{margin:12px 0 8px;font-size:21px}.onboard-card p{color:var(--muted);font-size:14.5px;line-height:1.6;margin:0;min-height:90px}.onboard-dots{display:flex;justify-content:center;gap:7px;margin:18px 0}.onboard-dots i{width:8px;height:8px;border-radius:50%;background:var(--line);cursor:pointer;transition:all .2s}.onboard-dots i.on{background:var(--green);width:22px;border-radius:5px}.onboard-actions{display:flex;gap:10px}.center-empty{text-align:center;color:var(--muted);padding:48px 20px}.center-empty .big{font-size:40px}.empty-disc{width:84px;height:84px;margin:0 auto 14px;border-radius:50%;background:var(--green-soft);display:grid;place-items:center}.muted{color:var(--muted)}.price-total{font-size:22px;font-weight:800;color:var(--green-dark)}.flag-stripe{height:4px;display:flex}.flag-stripe i{flex:1}.flag-stripe .g{background:var(--green)}.flag-stripe .y{background:var(--yellow)}.flag-stripe .r{background:var(--red)}.toast{position:fixed;bottom:calc(90px + var(--safe-bottom));left:50%;transform:translate(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;z-index:100;box-shadow:var(--shadow);max-width:90%;text-align:center}.banner{background:var(--yellow);color:#4a3b00;font-size:12px;padding:8px 16px;text-align:center;font-weight:600}.list-reset{list-style:none;padding:0;margin:0}.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.kpi{position:relative;overflow:hidden;background:var(--card);border-radius:14px;padding:14px;box-shadow:var(--shadow-soft);border:1px solid var(--line)}.kpi:before{content:"";position:absolute;top:0;left:14px;width:26px;height:3px;border-radius:0 0 3px 3px;background:var(--green)}.kpi .n{font-size:24px;font-weight:800;color:var(--green-dark)}.kpi .l{font-size:12px;color:var(--muted)}.divider{height:1px;background:var(--line);margin:14px 0}.avatar-drv{width:46px;height:46px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font-size:22px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--green-soft);color:var(--green-dark);padding:7px 14px;border-radius:999px;font-size:12.5px;font-weight:700;border:none;cursor:pointer;font-family:inherit;transition:background .15s ease,color .15s ease,transform .1s ease}.chip:hover{transform:translateY(-1px)}.chip.active{background:var(--green);color:#fff}:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:6px}@media (min-width: 900px){body{background:#eef2f0}.app-shell{max-width:none;min-height:100vh;display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);grid-template-rows:auto 1fr auto;box-shadow:none;background:var(--bg)}.app-shell:not(:has(>.tabbar)){grid-template-columns:minmax(0,1fr)}.app-shell>.topbar{grid-column:-2;grid-row:1}.app-shell>.screen{grid-column:-2;grid-row:2}.app-shell>.footer-bar{grid-column:-2;grid-row:3}.app-shell>.hero{grid-column:1 / -1;grid-row:1 / -1}.app-shell>.tabbar{grid-column:1;grid-row:1 / -1;position:sticky;top:0;bottom:auto;height:100vh;flex-direction:column;align-items:stretch;gap:4px;padding:20px 14px;background:linear-gradient(180deg,var(--green-deep),var(--green-dark));border-top:none;border-right:1px solid rgba(255,255,255,.06)}.tabbar .brand{display:flex;align-items:center;gap:10px;color:#fff;font-size:17px;padding:6px 12px 22px;letter-spacing:.3px}.tabbar .brand .logo{font-size:24px}.tabbar a{flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:12px;font-size:14px;color:#ffffffb8;padding:11px 12px;border-radius:11px}.tabbar a:hover{background:#ffffff14;color:#fff}.tabbar a.active{background:#ffffff24;color:#fff}.tabbar .ic{font-size:18px}.tabbar .side-logout{display:flex;align-items:center;gap:12px;margin-top:auto;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);color:#ffffffd9;padding:11px 12px;border-radius:11px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;text-align:left;transition:background .15s ease}.tabbar .side-logout:hover{background:#e8112d40;color:#fff}.tabbar .side-foot{display:block;padding:12px;color:#ffffff73;font-size:11px;line-height:1.5}.topbar{background:var(--card);color:var(--ink);box-shadow:none;border-bottom:1px solid var(--line);padding:18px clamp(24px,4vw,48px)}.topbar h1{font-size:22px}.topbar .sub{color:var(--muted);opacity:1;font-size:13px}.topbar .back,.topbar .pill{background:var(--green-soft);color:var(--green-dark)}.screen{max-width:var(--content-w);margin:0 auto;padding:28px clamp(24px,4vw,48px) 64px}.section-title{margin-top:26px}.card{padding:18px}.grid-cards{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}.kpi-grid{grid-template-columns:repeat(4,1fr);gap:14px}.kpi{padding:18px}.kpi .n{font-size:28px}.card:has(>.product){display:grid;grid-template-columns:1fr 1fr;column-gap:40px;padding:6px 22px}.footer-bar{position:static;background:transparent;border-top:none;box-shadow:none;padding:16px 0 0}.app-shell>.footer-bar{padding:0 clamp(24px,4vw,48px) 40px}.footer-bar .btn{max-width:420px;margin:0 auto;display:flex}.cart-fab{left:auto;right:40px;transform:none;width:380px}.toast{bottom:32px}.map-wrap.tall{height:52vh}.hero{flex-direction:row;align-items:center;justify-content:center;gap:clamp(40px,7vw,110px);padding:60px}.hero>div:first-child{max-width:520px}.hero .logo{font-size:64px}.hero h1{font-size:52px;margin:18px 0 12px}.hero p.tag{font-size:18px}.hero .hero-points{display:flex;flex-direction:column;gap:10px;margin-top:28px;font-size:14px;opacity:.92}.hero>div:last-child{width:400px;flex-shrink:0}.role-btn{padding:18px}}@media (min-width: 1400px){.card:has(>.product){grid-template-columns:1fr 1fr 1fr}}