:root{--topbar-bg:#fff;--brand-color:#1a365d;--main-bg:#f0f2f5;--btn-orange:#f39c12;--btn-red:#d9534f;--btn-green:#5cb85c;--btn-blue:#337ab7;--btn-dark-red:#c0392b;--border-color:#ccc}*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}@keyframes toastIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}input,select,textarea{font-size:16px}body{background-color:var(--main-bg);color:#333;flex-direction:column;height:100dvh;font-size:13px;display:flex;overflow:hidden}.top-navbar{border-bottom:1px solid var(--border-color);background-color:#fff;align-items:center;gap:12px;padding:6px 12px;display:flex}.brand-logo{color:#1e3d59;letter-spacing:-1px;flex-shrink:0;font-size:22px;font-weight:900}.top-menu{white-space:nowrap;scrollbar-width:thin;flex:auto;align-items:center;gap:4px;min-width:0;display:flex;overflow-x:auto}.top-menu::-webkit-scrollbar{height:4px}.top-menu::-webkit-scrollbar-thumb{background:#ccc;border-radius:2px}.top-menu button{cursor:pointer;color:#444;white-space:nowrap;background:0 0;border:none;flex-shrink:0;align-items:center;gap:4px;padding:4px 8px;font-size:12px;display:inline-flex}.top-menu button:hover{background:#e8e8e8;border-radius:3px}.top-navbar>div:last-child{flex-shrink:0}.module-switcher{background:#2b3e50;gap:10px;padding:6px 12px;display:flex}.module-btn{color:#fff;cursor:pointer;background:#1a252f;border:none;border-radius:4px;padding:6px 16px;font-size:12px;font-weight:700}.module-btn.active{background:var(--btn-orange)}.screen-container{flex:1;padding:8px;position:relative;overflow:hidden}.screen-view{grid-template-columns:1fr 1fr;gap:8px;height:100%;display:none}.screen-view.active{display:grid}.left-panel{flex-direction:column;gap:8px;display:flex;overflow-y:auto}.action-row-1{gap:4px;display:flex}.action-btn{cursor:pointer;background:#f9f9f9;border:1px solid #ccc;border-radius:3px;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:8px 12px;font-size:11px;font-weight:700;display:flex}.action-btn i{margin-bottom:2px;font-size:14px}.action-btn.orange{background:var(--btn-orange);color:#fff;border:none}.action-btn.red{background:var(--btn-dark-red);color:#fff;border:none}.action-btn.green{background:var(--btn-green);color:#fff;border:none}.numpad-grid{grid-template-columns:repeat(11,1fr);gap:2px;margin:4px 0;display:grid}.num-btn{text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #b0b0b0;border-radius:2px;padding:10px 0;font-size:14px;font-weight:700}.num-btn:active{background:#ddd}.num-btn.clear{background:var(--btn-dark-red);color:#fff}.category-tabs{flex-wrap:wrap;gap:4px;margin-bottom:6px;display:flex}.category-tab{color:#444;cursor:pointer;background:#e8e8e8;border:none;border-radius:3px 3px 0 0;padding:6px 12px;font-size:11px;font-weight:700}.category-tab.active{color:#fff;background:#d9534f}.categories-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid;overflow-y:auto}.cat-btn{color:#333;text-align:center;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:6px;flex-direction:column;justify-content:flex-start;align-items:stretch;padding:0;font-size:11px;font-weight:700;display:flex;position:relative;overflow:hidden;box-shadow:0 1px 3px #00000014}.cat-btn:hover{border-color:#bbb;box-shadow:0 2px 6px #0000002e}.cat-btn.out-of-stock{opacity:.45;cursor:not-allowed;filter:grayscale(60%)}.out-of-stock-badge{color:#fff;letter-spacing:.4px;z-index:2;white-space:nowrap;background:#c0392beb;border-radius:10px;padding:3px 8px;font-size:9px;font-weight:800;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.item-photo{color:#fff;justify-content:center;align-items:center;width:100%;height:54px;font-size:26px;display:flex}.item-label{flex-direction:column;gap:2px;padding:6px 4px 8px;display:flex}.item-label strong{color:#c0392b;font-size:11px}.item-label span.includes{color:#777;font-size:9px;font-weight:400}.combo-ribbon{background:var(--btn-green);color:#fff;letter-spacing:.5px;padding:1px 20px;font-size:8px;font-weight:700;position:absolute;top:4px;left:-18px;transform:rotate(-40deg)}.customize-gear{color:#fff;cursor:pointer;background:#00000073;border:none;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:9px;display:flex;position:absolute;top:4px;right:4px}.customize-gear:hover{background:#000000b3}.customize-hint{color:#777;margin:2px 0 6px;font-size:10px;font-style:italic}.module-btn.locked{color:#aebdcc;background:0 0;border:1px dashed #6c8299}.module-btn.locked:hover{color:#fff;border-color:#fff}.value-banner{color:#7a5b00;text-align:center;background:#fff8e1;border-bottom:1px solid #f0dca0;padding:4px 12px;font-size:11px}.modal-overlay{z-index:100;background:#00000080;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.active{display:flex}.modal-box{background:#fff;border-radius:5px;width:380px;max-width:92vw;max-height:82vh;overflow-y:auto;box-shadow:0 8px 30px #0000004d}.modal-header{background:var(--brand-color);color:#fff;justify-content:space-between;align-items:center;padding:10px 14px;font-size:14px;font-weight:700;display:flex}.modal-header .close-x{cursor:pointer;opacity:.8}.modal-header .close-x:hover{opacity:1}.modal-body{padding:14px;font-size:12px}.modal-body p{color:#444;margin-bottom:10px;line-height:1.5}.modifier-list label{cursor:pointer;border-bottom:1px solid #f0f0f0;align-items:center;gap:6px;padding:6px 4px;display:flex}.modal-footer{border-top:1px solid #eee;justify-content:flex-end;gap:8px;padding:10px 14px;display:flex}.modal-note{resize:none;border:1px solid #ccc;border-radius:3px;width:100%;height:40px;margin-top:8px;padding:6px;font-size:11px}.guide-step{border-bottom:1px solid #f0f0f0;align-items:flex-start;gap:12px;padding:10px 0;display:flex}.guide-step:last-child{border-bottom:none}.guide-step i{width:30px;height:30px;color:var(--brand-color);background:#eef3fb;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;display:flex}.guide-step strong{color:var(--brand-color);font-size:12px}.guide-step div:last-child{color:#555;font-size:11.5px;line-height:1.5}.subsystem-row{border-bottom:1px solid #f2f2f2;align-items:flex-start;gap:8px;padding:7px 0;display:flex}.subsystem-row i.included{color:var(--btn-green)}.subsystem-row i.locked-icon{color:#bbb}.subsystem-row i.partial-icon{color:#c99a2e}.subsystem-row .tag{white-space:nowrap;border-radius:8px;align-self:center;margin-left:auto;padding:1px 6px;font-size:9px;font-weight:700}.subsystem-row .tag.in-demo{color:#2e7d32;background:#dff5df}.subsystem-row .tag.full-only{color:#888;background:#f0f0f0}.subsystem-row .tag.partial{color:#8a6d1f;background:#fff3cd}.floor-canvas-sm{background:repeating-linear-gradient(45deg,#f7ede1,#f7ede1 10px,#f2e5d3 10px 20px);border:2px solid #cbb994;border-radius:6px;width:100%;height:360px;position:relative;overflow:hidden}.kitchen-wall-sm{color:#fff;letter-spacing:1px;background:#8a97a3;justify-content:center;align-items:center;height:24px;font-size:9px;font-weight:700;display:flex;position:absolute;top:0;left:0;right:0}.table-shape-sm{background:var(--btn-blue);color:#fff;cursor:pointer;border:2px solid #fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:50px;height:50px;font-size:12px;font-weight:700;display:flex;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 5px #0000004d}.table-shape-sm:hover{filter:brightness(1.1)}.table-shape-sm.occupied{background:var(--btn-dark-red);cursor:pointer}.table-shape-sm .srv-sm{opacity:.9;text-overflow:ellipsis;white-space:nowrap;max-width:46px;font-size:7px;font-weight:400;overflow:hidden}.floor-legend{color:#666;gap:14px;margin-top:8px;font-size:10px;display:flex}.floor-legend span{align-items:center;gap:4px;display:inline-flex}.legend-dot{border-radius:50%;width:10px;height:10px;display:inline-block}.auth-overlay{z-index:500;background:linear-gradient(135deg, var(--brand-color), #2b4a7a);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.auth-overlay.hidden{display:none}.auth-card{text-align:center;background:#fff;border-radius:8px;width:360px;max-width:90vw;padding:28px 24px;box-shadow:0 12px 40px #00000059}.auth-brand{color:var(--brand-color);letter-spacing:-1px;margin-bottom:10px;font-size:26px;font-weight:900}.auth-card p{color:#666;margin-bottom:18px;font-size:12px;line-height:1.5}.auth-google-btn{color:#444;cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:4px;justify-content:center;align-items:center;gap:8px;width:100%;padding:11px;font-size:13px;font-weight:700;display:flex}.auth-google-btn:hover{background:#f5f5f5}.auth-google-btn i{color:#4285f4}.auth-error{color:var(--btn-dark-red);margin-top:10px;font-size:11px}.big-action-container{grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;display:grid}.big-btn{color:#fff;cursor:pointer;text-align:center;border:none;border-radius:4px;padding:12px;font-size:14px;font-weight:700}.big-btn.expenses{background:var(--btn-orange)}.big-btn.income{background:var(--btn-green)}.right-panel{border:1px solid var(--border-color);background:#fff;border-radius:3px;flex-direction:column;height:100%;padding:8px;display:flex}.payment-top-bar{grid-template-columns:1fr 1fr 1fr;gap:4px;margin-bottom:8px;display:grid}.pay-tab{background:var(--btn-blue);color:#fff;cursor:pointer;border:none;border-radius:3px;padding:10px;font-size:12px;font-weight:700}.pay-tab.visa{color:#333;background:#e0e0e0}.pay-tab.multi{background:var(--btn-orange)}.amount-display{color:#fff;background:#337ab7;border-radius:2px;justify-content:space-between;margin-bottom:8px;padding:10px;font-size:14px;font-weight:700;display:flex}.remarks-box{resize:none;border:1px solid #ccc;width:100%;height:50px;margin-bottom:8px;padding:4px}.totals-table{border-collapse:collapse;width:100%;margin-bottom:8px}.totals-table td{background:#f9f9f9;border:1px solid #e0e0e0;padding:6px;font-weight:700}.table-controls{grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:8px;display:grid}.tbl-btn{color:#fff;cursor:pointer;border:none;border-radius:2px;padding:8px;font-size:11px;font-weight:700}.tbl-btn.green{background:var(--btn-green)}.tbl-btn.orange{background:var(--btn-orange)}.tbl-btn.red{background:var(--btn-dark-red)}.delivery-fields{grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:8px;display:grid}.delivery-fields input{border:1px solid #ccc;border-radius:2px;width:100%;padding:6px;font-size:16px}.cart-item-row{border-bottom:1px dashed #ccc;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px;display:flex}.cart-controls{align-items:center;gap:4px;display:flex}.cart-btn{cursor:pointer;background:#eee;border:1px solid #ccc;border-radius:3px;justify-content:center;align-items:center;width:22px;height:22px;font-weight:700;display:flex}.cart-btn:hover{background:#ddd}.cart-btn.del{background:var(--btn-dark-red);color:#fff;border:none}footer{text-align:center;color:#666;background:#e0e0e0;border-top:1px solid #ccc;padding:4px;font-size:11px}@media (width>=821px) and (width<=1100px){.categories-grid{grid-template-columns:repeat(3,1fr)}.screen-view.active{grid-template-columns:1.3fr 1fr}.top-menu button{padding:5px 7px;font-size:11px}input,select,textarea{min-height:38px}.cat-btn,.pay-tab,.tbl-btn,.big-btn{min-height:42px}}@media (width<=820px){body{height:auto;min-height:100vh;overflow-y:auto}.top-navbar{flex-wrap:wrap;row-gap:6px}.top-menu{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;order:3;width:100%;padding-bottom:4px;overflow-x:auto}.top-menu button{flex-shrink:0}.module-switcher{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;overflow-x:auto}.module-btn{flex-shrink:0}.value-banner{padding:4px 8px;font-size:10px}.screen-container{padding:6px;overflow-y:visible}.screen-view.active{flex-direction:column;height:auto;display:flex}.left-panel,.right-panel{height:auto;overflow-y:visible}.categories-grid{grid-template-columns:repeat(2,1fr)}.numpad-grid{grid-template-columns:repeat(6,1fr)}.delivery-fields,.table-controls{grid-template-columns:repeat(2,1fr)}.big-action-container{grid-template-columns:1fr 1fr}.floor-canvas-sm{height:280px}.modal-box{width:92vw!important}.auth-card{width:92vw;padding:22px 18px}}@media (width<=480px){.brand-logo{font-size:18px}.item-photo{height:40px;font-size:18px}.item-label strong{font-size:10px}#branchSelect{font-size:11px!important}#signedInName{display:none}}