:root{--brand:#1a6b3c;--brand-dark:#145530;--brand-light:#eaf3de;--leaf:#22c55e;--night:#0f1923;--dark:#1a1a2e;--cream:#f7f5f0;--white:#fff;--border:#e5e2da;--muted:#6b7280;--ember:#e65100;--amber-light:#fff3e0;--red:#b71c1c;--blue:#1565c0;--font-display:"Syne", sans-serif;--font-body:"DM Sans", sans-serif;--font-mono:"DM Mono", monospace;--radius-btn:8px;--radius-card:12px;--radius-input:8px;--radius-badge:4px;--radius-pill:20px;--shadow-card:0 1px 3px #00000014, 0 1px 2px #0000000a;--shadow-modal:0 20px 60px #0000002e, 0 8px 24px #0000001a;--shadow-dropdown:0 4px 16px #0000001f, 0 2px 6px #0000000f;--sidebar-width:240px;--sidebar-icon:60px;--t-fast:.15s ease;--t-base:.2s ease;--t-layout:.3s ease;--t-logo:.5s cubic-bezier(.34, 1.56, .64, 1);--t-sidebar:.4s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:15px}body{font-family:var(--font-body);color:var(--dark);background:var(--cream);min-height:100dvh;font-weight:400;line-height:1.65}h1,h2,h3,h4{font-family:var(--font-display);line-height:1.15}h1{letter-spacing:-.03em;font-size:clamp(32px,5vw,40px);font-weight:800}h2{letter-spacing:-.02em;font-size:clamp(22px,3vw,26px);font-weight:700}h3{letter-spacing:-.01em;font-size:clamp(16px,2vw,18px);font-weight:700}p{font-family:var(--font-body);color:var(--muted);font-size:14px;line-height:1.65}.zella-logo{-webkit-user-select:none;user-select:none;align-items:center;gap:1px;text-decoration:none;display:inline-flex}.zella-logo .z-mark{flex-shrink:0}.ella-text{align-items:center;display:inline-flex;overflow:hidden}.ella-inner{font-family:var(--font-display);letter-spacing:-.02em;color:#fff;opacity:0;transition:transform var(--t-logo), opacity .3s ease;white-space:nowrap;font-size:28px;font-weight:800;transform:translate(-110%)}.ella-inner.animate{opacity:1;transform:translate(0)}.zella-logo.light .ella-inner{color:var(--dark)}.btn{font-family:var(--font-display);letter-spacing:.01em;border-radius:var(--radius-btn);cursor:pointer;transition:background var(--t-base), transform var(--t-fast), box-shadow var(--t-base), opacity var(--t-base);white-space:nowrap;border:none;justify-content:center;align-items:center;gap:6px;font-size:13px;font-weight:700;text-decoration:none;display:inline-flex}.btn:hover{transform:scale(1.02)}.btn:active{transition-duration:.1s;transform:scale(.97)}.btn-sm{height:32px;padding:0 14px;font-size:12px}.btn-md{height:40px;padding:0 20px}.btn-lg{height:48px;padding:0 28px;font-size:15px}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover:not(:disabled){background:var(--brand-dark);box-shadow:0 4px 14px #1a6b3c52}.btn-primary:active:not(:disabled){box-shadow:none}.btn-success-flash{animation:.45s both btnSuccessFlash}@keyframes btnSuccessFlash{0%{background:var(--brand)}40%{background:#22c55e;box-shadow:0 4px 14px #22c55e66}to{background:var(--brand);box-shadow:none}}.btn-ghost{color:var(--dark);border:1.5px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--cream);border-color:var(--brand);color:var(--brand)}.btn-danger{background:var(--red);color:#fff}.btn-leaf{background:var(--leaf);color:#fff}.card{background:var(--white);border-radius:var(--radius-card);box-shadow:var(--shadow-card);border:1px solid var(--border);padding:20px}@media (max-width:768px){.card{padding:16px}}.input,.textarea,.select{font-family:var(--font-body);color:var(--dark);background:var(--white);border:1.5px solid var(--border);border-radius:var(--radius-input);width:100%;height:40px;transition:border-color var(--t-base), box-shadow var(--t-base);outline:none;padding:0 12px;font-size:14px}.textarea{resize:vertical;height:auto;padding:10px 12px;line-height:1.65}.input:focus,.textarea:focus,.select:focus{border-color:var(--brand);box-shadow:0 0 0 3px #1a6b3c1f}.input-success{border-color:var(--leaf)!important;box-shadow:0 0 0 3px #22c55e1f!important}.input-error{border-color:var(--red)!important;box-shadow:0 0 0 3px #b71c1c14!important}.input::placeholder,.textarea::placeholder{color:var(--muted);opacity:.7}.badge{border-radius:var(--radius-badge);font-family:var(--font-display);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;align-items:center;padding:3px 8px;font-size:10px;font-weight:600;display:inline-flex}.badge-green{background:var(--brand-light);color:var(--brand)}.badge-leaf{color:#16a34a;background:#22c55e1f}.badge-red{color:var(--red);background:#b71c1c1a}.badge-amber{background:var(--amber-light);color:var(--ember)}.badge-blue{color:var(--blue);background:#1565c01a}.badge-muted{background:var(--cream);color:var(--muted);border:1px solid var(--border)}.badge-night{background:var(--night);color:#fff}.order-ref{font-family:var(--font-mono);color:var(--brand);font-size:13px;font-weight:500}.stat-number{font-family:var(--font-display);letter-spacing:-.04em;font-weight:800}.label{font-family:var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-size:10px;font-weight:500}.sidebar{width:var(--sidebar-width);background:var(--night);height:100dvh;transition:width var(--t-sidebar), transform var(--t-sidebar);z-index:100;flex-direction:column;display:flex;position:fixed;top:0;left:0;overflow:hidden}.sidebar.collapsed{width:var(--sidebar-icon)}.sidebar.hidden{transform:translate(-100%)}@keyframes sidebarOpen{0%{width:0}to{width:var(--sidebar-width)}}.sidebar-enter{animation:sidebarOpen var(--t-sidebar) ease both}@keyframes fadeUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:.4s both fadeUp}.fade-up-1{animation-delay:0s}.fade-up-2{animation-delay:50ms}.fade-up-3{animation-delay:.1s}.fade-up-4{animation-delay:.15s}.fade-up-5{animation-delay:.2s}.fade-up-6{animation-delay:.25s}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.slide-in{animation:.3s both slideIn}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.slide-in-right{animation:.3s both slideInRight}@keyframes countUp{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}.slide-down{animation:.3s both slideDown}@keyframes toastIn{0%{opacity:0;transform:translate(calc(100% + 24px))}to{opacity:1;transform:translate(0)}}@keyframes toastOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(calc(100% + 24px))}}@keyframes modalIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-enter{animation:.2s both modalIn}@keyframes drawerIn{0%{transform:translate(100%)}to{transform:translate(0)}}.drawer-enter{animation:.3s both drawerIn}@keyframes amberPulse{0%,to{box-shadow:0 0 #e6510000}50%{box-shadow:0 0 0 6px #e651002e}}.receipt-pending{animation:2s infinite amberPulse}.count-up{font-variant-numeric:tabular-nums;display:inline-block}.toast-container{z-index:9999;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--night);color:#fff;border-radius:var(--radius-card);min-width:280px;max-width:380px;box-shadow:var(--shadow-modal);font-family:var(--font-body);border-left:3px solid var(--leaf);align-items:center;gap:12px;padding:14px 18px;font-size:13.5px;display:flex}.toast.toast-error{border-left-color:var(--red)}.toast.toast-warn{border-left-color:var(--ember)}.toast.toast-info{border-left-color:var(--blue)}.toast.entering{animation:.3s both toastIn}.toast.leaving{animation:.3s both toastOut}@keyframes livePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}.live-dot{background:var(--leaf);border-radius:50%;width:8px;height:8px;animation:1.5s infinite livePulse;display:inline-block}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--muted)}:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.sr-only{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mono{font-family:var(--font-mono)}.on-night h1,.on-night h2,.on-night h3,.on-night p,.on-night .label{color:#ffffffb3}.on-night h1,.on-night h2,.on-night h3{color:#fff}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%) 0 0/200% 100%;border-radius:6px;animation:1.5s infinite shimmer}@keyframes spin{to{transform:rotate(360deg)}}.inline-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;flex-shrink:0;width:12px;height:12px;animation:.6s linear infinite spin}.state-banner{z-index:49;font-family:var(--font-body);justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:13px;font-weight:500;animation:.3s both slideDown;display:flex;position:sticky;top:56px;left:0;right:0}.state-banner-offline{color:#fff;background:#6b7280;height:38px}.state-banner-offline.restored{background:var(--brand)}.state-banner-realtime{color:#fff;background:#f59e0b;width:100%;height:24px;font-size:11.5px;position:fixed;top:0}.state-banner-ai{background:var(--amber-light);height:38px;color:var(--ember);border-bottom:1px solid #e6510026}.session-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9000;background:#0f1923b3;justify-content:center;align-items:center;animation:.2s both modalIn;display:flex;position:fixed;inset:0}.msg-error-icon{color:#fff;cursor:pointer;background:#ef4444;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;font-size:10px;font-weight:700;display:inline-flex}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:64px 24px;display:flex}.empty-state-icon{background:var(--brand-light);border-radius:20px;justify-content:center;align-items:center;width:72px;height:72px;margin-bottom:4px;display:flex}.empty-state h3{color:var(--dark);margin-bottom:2px;font-size:18px}.empty-state p{max-width:320px;color:var(--muted);font-size:14px;line-height:1.6}#bottom-nav{display:none}.scroll-container,[style*="overflow-y: auto"],[style*="overflowY: auto"]{-webkit-overflow-scrolling:touch}#dashboard-shell,.auth-page,.onboarding-page{min-height:100dvh}button,a{-webkit-touch-callout:none}*{-webkit-tap-highlight-color:transparent}@media (pointer:coarse){.btn,.input,.textarea,select,nav a{min-height:44px}}@keyframes pullRefresh{0%{opacity:0;transform:translateY(-16px)rotate(0)}50%{opacity:1;transform:translateY(0)rotate(180deg)}to{opacity:0;transform:translateY(8px)rotate(360deg)}}.pull-refresh-spinner{background:var(--brand);z-index:300;color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:16px;animation:.6s both pullRefresh;display:flex;position:fixed;top:68px;left:50%;transform:translate(-50%);box-shadow:0 4px 12px #1a6b3c4d}.subscription-expired-bg{background:linear-gradient(135deg,#7f0000 0%,#b71c1c 40%,#c62828 100%)}.checklist-card-active{border:2px solid var(--brand)!important;box-shadow:0 0 0 3px #1a6b3c14!important}@keyframes urgentPulse{0%,to{box-shadow:0 0 #b71c1c00}50%{box-shadow:0 0 0 4px #b71c1c26}}#wa-quality-banner[data-rating=red]{animation:2s infinite urgentPulse}.order-mobile-card{background:var(--white);border:1px solid var(--border);cursor:pointer;border-radius:12px;margin:0 16px 10px;padding:14px 16px;transition:box-shadow .15s;position:relative;overflow:hidden}.order-mobile-card:active{transform:scale(.99);box-shadow:0 0 0 2px #1a6b3c33}.order-mobile-card.receipt{background:#fff3e0b3;border-color:#e6510040}.order-context-menu{background:var(--white);border:1px solid var(--border);box-shadow:var(--shadow-modal);z-index:600;border-radius:12px;min-width:200px;padding:6px 0;animation:.15s both fadeIn;position:fixed}.order-context-menu button{cursor:pointer;width:100%;font-family:var(--font-body);color:var(--dark);text-align:left;background:0 0;border:none;align-items:center;gap:10px;min-height:44px;padding:12px 16px;font-size:14px;display:flex}.order-context-menu button:hover{background:var(--cream)}.order-context-menu button.danger{color:var(--red)}@media (max-width:767px){#order-detail-drawer{border-radius:20px 20px 0 0;max-height:92dvh;width:100%!important;animation:.3s cubic-bezier(.34,1.16,.64,1) both drawerIn!important;inset:auto 0 0!important}#new-order-drawer{border-radius:20px 20px 0 0;max-height:96dvh;width:100%!important;animation:.3s cubic-bezier(.34,1.16,.64,1) both drawerIn!important;inset:auto 0 0!important}#home-stats-grid{grid-template-columns:repeat(2,1fr)!important}#home-page,#orders-page,#catalogue-page{padding:20px 16px 24px!important}#orders-heading,#home-heading,#catalogue-heading{font-size:24px!important}#conversations-page{height:calc(100dvh - 56px - 64px - env(safe-area-inset-bottom));overflow:hidden;padding:0!important}#conv-list-panel{flex-direction:column;display:flex;border-right:none!important;width:100%!important;max-width:100%!important}#conv-chat-panel{z-index:250;background:var(--white);animation:.25s cubic-bezier(.34,1.16,.64,1) both slideInRight;position:fixed;inset:0}#conv-back-btn{display:flex!important}}#catalogue-grid{grid-template-columns:repeat(3,1fr)}@media (max-width:1023px){#catalogue-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:767px){#catalogue-grid{grid-template-columns:1fr!important;gap:10px!important}.chart-scroll-wrapper{-webkit-overflow-scrolling:touch;padding-bottom:8px;overflow-x:auto}.chart-scroll-wrapper>*{min-width:600px}.funnel-horizontal{flex-direction:column!important;align-items:stretch!important}.funnel-horizontal .funnel-arrow{align-self:center;transform:rotate(90deg)}.heatmap-container{-webkit-overflow-scrolling:touch;overflow-x:auto}}@media (min-width:768px) and (max-width:1023px){#dashboard-main{margin-left:0!important}#catalogue-grid{grid-template-columns:repeat(2,1fr)!important}#orders-table th,#orders-table td{padding:10px 12px!important}}.swipe-actions-row{align-items:stretch;display:flex;position:absolute;top:0;bottom:0;right:0}.swipe-action-btn{cursor:pointer;width:80px;font-family:var(--font-body);color:#fff;border:none;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:44px;font-size:11px;font-weight:600;transition:filter .15s;display:flex}.swipe-action-btn:active{filter:brightness(.9)}.swipe-action-btn.confirm{background:var(--brand)}.swipe-action-btn.reject{background:var(--red)}.swipe-action-btn.handoff{background:#3b82f6}.swipe-action-btn.close{background:var(--muted)}.swipe-action-btn.edit{background:#6366f1}.swipe-action-btn.delete{background:var(--red)}.long-press-backdrop{z-index:590;background:#0003;animation:.1s both fadeIn;position:fixed;inset:0}#topnav-mobile-logo{display:none}@media (max-width:767px){#topnav-mobile-logo{display:flex!important}#topnav-page-title{display:none}#dashboard-topnav{padding:0 16px}}@media (min-width:768px) and (max-width:1023px){#dashboard-topnav{padding:0 20px}}.orders-mobile-list{display:none}.orders-desktop-table{display:block}@media (max-width:767px){.orders-mobile-list{display:block!important}.orders-desktop-table{display:none!important}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in-anim{animation:.3s both fadeIn}@keyframes slideInRightSpring{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}.slide-in-right-spring{animation:.35s cubic-bezier(.34,1.56,.64,1) both slideInRightSpring}@keyframes slideInLeft{0%{opacity:0;transform:translate(-24px)}to{opacity:1;transform:translate(0)}}.slide-in-left{animation:.35s both slideInLeft}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(24px)}}.slide-out-right{animation:.25s forwards slideOutRight}@keyframes scaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.scale-in{animation:.2s both scaleIn}@keyframes bounceIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.bounce-in{animation:.5s cubic-bezier(.34,1.56,.64,1) both bounceIn}@keyframes pulseRing{0%{box-shadow:0 0 #22c55e8c}70%{box-shadow:0 0 0 8px #22c55e00}to{box-shadow:0 0 #22c55e00}}@keyframes typingDot{0%,60%,to{opacity:.4;transform:scale(.6)}30%{opacity:1;transform:scale(1)}}@keyframes pulseDot{0%,to{box-shadow:0 0 #22c55e66}50%{box-shadow:0 0 0 6px #22c55e00}}@keyframes statCount{0%{opacity:0;transform:scale(.85)translateY(4px)}to{opacity:1;transform:scale(1)translateY(0)}}.stat-count-enter{animation:.4s cubic-bezier(.34,1.56,.64,1) both statCount}.page-transition-enter{animation:.35s both fadeUp}.live-indicator{cursor:default;-webkit-user-select:none;user-select:none;background:#1a6b3c14;border:1px solid #1a6b3c2e;border-radius:20px;align-items:center;gap:7px;padding:5px 12px;transition:background .2s;display:inline-flex}.live-dot{background:#22c55e;border-radius:50%;flex-shrink:0;width:8px;height:8px;animation:2s ease-out infinite pulseRing}.live-dot-paused{background:#9ca3af;border-radius:50%;flex-shrink:0;width:8px;height:8px}.live-indicator-text{font-family:var(--font-body);color:var(--brand);white-space:nowrap;font-size:12px;font-weight:500}.live-indicator.paused .live-indicator-text{color:var(--muted)}.live-indicator.paused{background:#6b72800f;border-color:#6b728026}.stat-card{transition:transform .18s,box-shadow .18s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000001a}.catalogue-card{transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}.catalogue-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #0000001a}.catalogue-card-actions{opacity:0;background:linear-gradient(#0000,#fffffffa 40%);gap:6px;padding:10px;transition:transform .22s,opacity .22s;display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(100%)}.catalogue-card:hover .catalogue-card-actions{opacity:1;transform:translateY(0)}.list-row{transition:background .1s}.list-row:hover{background:var(--cream)!important}.list-row.selected{border-left:3px solid var(--brand);background:#1a6b3c0a!important}.toggle-track{cursor:pointer;background:#d1d5db;border:none;border-radius:12px;flex-shrink:0;align-items:center;width:44px;height:24px;padding:0;transition:background .2s;display:inline-flex;position:relative}.toggle-track:hover{transform:scale(1.05)}.toggle-track.on{background:var(--brand)}.toggle-thumb{background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;left:3px;box-shadow:0 1px 3px #00000040}.toggle-track.on .toggle-thumb{transform:translate(20px)}.skeleton{background:linear-gradient(90deg, var(--cream) 25%, #eeebe4 50%, var(--cream) 75%);background-size:400% 100%;border-radius:6px;animation:1.6s linear infinite shimmer}.skeleton-text{border-radius:4px;height:14px}.skeleton-title{border-radius:6px;width:60%;height:22px}.skeleton-avatar{border-radius:50%}.skeleton-card{border-radius:var(--radius-card);height:100px}.badge-pop{animation:.3s cubic-bezier(.34,1.56,.64,1) both bounceIn}@media (max-width:767px){#topnav-mobile-logo{display:flex!important}}:root{--color-receipt:#fff3e0;--color-receipt-border:#e6510040;--color-amber-dark:#7c2d00;--color-violet:#7c3aed;--page-padding:32px}input:not([type=checkbox]):not([type=radio]):not([type=range]),select:not(.no-height-fix){box-sizing:border-box}.page-shell{animation:.35s both fadeUp}.stagger-1{animation-delay:0s}.stagger-2{animation-delay:50ms}.stagger-3{animation-delay:.1s}.stagger-4{animation-delay:.15s}.stagger-5{animation-delay:.2s}.stagger-6{animation-delay:.25s}.stagger-7{animation-delay:.3s}.stagger-8{animation-delay:.35s}.card-hover{cursor:pointer;transition:transform .18s,box-shadow .18s}.card-hover:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000001a}.btn-destructive{color:var(--red);background:#b71c1c14;border:1.5px solid #b71c1c33}.btn-destructive:hover:not(:disabled){border-color:var(--red);background:#b71c1c29}#dashboard-main{background:var(--cream)}.section-divider{background:var(--border);height:1px;margin:32px 0}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (max-width:767px){:root{--page-padding:16px}}