
:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#243e34;background:#f5f6f1;font-size:16px;--green:#236448;--line:#e2e7df;--muted:#748077}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #77a889;outline-offset:3px}button{border:0}button:disabled{opacity:.5;cursor:default}.app{max-width:520px;margin:auto;padding:22px 20px 120px}.preview{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6f7a70;margin-bottom:24px}.preview button{background:none;font-size:12px;text-decoration:underline;padding:8px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}h1{font-size:29px;letter-spacing:-1px;margin:0}h2{font-size:24px;letter-spacing:-.6px;margin:0 0 8px}p{line-height:1.5}.sub{font-size:14px;color:var(--muted);margin:8px 0 20px}.add{width:46px;height:46px;border-radius:50%;background:var(--green);color:white;font-size:28px}.tabs{display:flex;padding:5px;background:#e7ece4;border-radius:18px;gap:5px;margin-bottom:24px}.tabs button{flex:1;border-radius:13px;background:none;padding:13px;font-weight:650;font-size:15px}.tabs .active{background:white;box-shadow:0 2px 8px #243e3410}.counter{background:#e5eee6;padding:2px 7px;margin-left:5px;border-radius:8px;font-size:12px}input,select{background:white;border:1px solid var(--line);border-radius:14px;padding:14px;max-width:100%;min-width:0;width:100%;color:#243e34}input[type=checkbox]{width:25px;height:25px;accent-color:var(--green);padding:0;flex-shrink:0}input[type=search]{margin-bottom:22px}.section{font-size:12px;font-weight:650;color:#6f7c6e;text-transform:uppercase;letter-spacing:1.1px;margin:22px 0 12px}.card{background:white;border:1px solid var(--line);border-radius:20px;margin-bottom:12px;display:flex;align-items:center;gap:15px;padding:18px;width:100%;text-align:left;min-height:94px;transition:transform .12s,background .12s}.card:hover{background:#fcfdfb}.card:active{transform:scale(.985)}.art{width:54px;height:60px;flex-shrink:0;border-radius:15px;display:grid;place-items:center;background:#f1e9dd}.art.milk{background:#e9eef6}.art svg{width:34px;height:44px}.info{flex:1;min-width:0}.name{font-size:18px;font-weight:650}.detail{font-size:13px;color:var(--muted);line-height:1.5;margin-top:4px}.arrow{font-size:24px;color:#9aaa9c}.tag{display:inline-block;background:#e8f0e7;color:#39654b;border-radius:7px;font-size:11px;padding:3px 7px;margin-top:7px}.shoprow{display:flex;align-items:center;background:white;border:1px solid var(--line);border-radius:20px;margin-bottom:12px;padding:0 16px;gap:8px}.check{padding:22px 5px;display:flex;align-items:center;min-height:90px;cursor:pointer}.shoprow .card{border:0;margin:0;padding:18px 8px;background:transparent}.shoprow.done{background:#eef3eb}.shoprow.done .name{text-decoration:line-through;color:#758374}.shoprow .art{width:42px;height:50px}.dock{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(520px,100%);padding:16px 20px 24px;background:linear-gradient(#f5f6f100,#f5f6f1 20%);z-index:2}.primary,.secondary{border-radius:15px;padding:16px 20px;font-weight:650;width:100%;min-height:52px}.primary{color:white;background:var(--green)}.secondary{background:#eaf0e7;color:var(--green)}.dock .primary{box-shadow:0 6px 22px #234e3b22}.empty{padding:35px 15px;text-align:center;color:var(--muted)}dialog{border:0;border-radius:28px 28px 0 0;padding:0;width:min(520px,100%);max-width:100%;max-height:90dvh;position:fixed;inset:auto 0 0;margin:0 auto;box-shadow:0 -10px 80px #16372d15;color:inherit;background:#fafbf7;overflow:auto}dialog::backdrop{background:#17372c65;backdrop-filter:blur(3px)}.handle{width:38px;height:4px;border-radius:6px;background:#d6ddd3;margin:12px auto 4px}.sheet{padding:14px 24px 30px}.sheethead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:10px}.close,.back{background:#eaf0e7;border-radius:50%;width:38px;height:38px;font-size:23px;flex-shrink:0}.back{font-size:20px}.sheethead h2{margin:0;flex:1}.hero{display:flex;align-items:center;gap:18px;margin:10px 0 24px}.hero .art{width:76px;height:80px}.hero .name{font-size:24px}.action{display:flex;align-items:center;justify-content:space-between;background:white;border:1px solid var(--line);padding:20px 16px;border-radius:17px;min-height:68px;width:100%;margin:10px 0;text-align:left;font-weight:600}.action span:last-child{color:#97a496}.actions{display:flex;gap:10px;margin:20px 0}.actions button{flex:1}.sheet label{display:block;font-size:14px;margin:15px 0 7px}.bigvalue{display:flex;align-items:center;gap:14px;margin:25px 0}.bigvalue input{font-size:34px;font-weight:650;text-align:center;width:100%;padding:20px 8px}.bigvalue .unit{font-size:20px;color:var(--muted)}.choice{background:white;border:1px solid var(--line);border-radius:18px;margin-bottom:12px;overflow:hidden}.choice.selected{border:2px solid var(--green);background:#f0f6ee}.choice label{margin:0;padding:18px;display:flex;gap:14px;align-items:center;cursor:pointer}.choice .qty{display:flex;align-items:center;justify-content:space-between;padding:0 18px 16px;font-size:13px;color:var(--muted);gap:12px}.qty input{width:100px;padding:10px;text-align:center;font-weight:600}.columns{display:flex;gap:10px}.columns>*{flex:1}.hint{font-size:12px;color:var(--muted);line-height:1.5}.toast{position:fixed;top:15px;left:50%;transform:translateX(-50%);max-width:calc(100% - 30px);padding:13px 20px;background:#243e34;color:white;border-radius:14px;z-index:5;font-size:14px;box-shadow:0 4px 22px #0002}.line{display:flex;justify-content:space-between;gap:15px;padding:16px 0;border-bottom:1px solid var(--line)}.line strong{font-size:15px}.notice{background:#eaf0e7;padding:16px;border-radius:14px;font-size:14px;line-height:1.5}.smallbutton{background:none;padding:12px 0;color:var(--green);font-size:14px}.saved{font-size:12px;color:var(--muted);text-align:center;margin:24px 0}.error{color:#ab3f32;margin:12px 0;font-size:14px}@media(min-width:650px){dialog{bottom:20px;border-radius:28px}.app{padding-top:35px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}} 

.scanhero{background:#e4eee3;border-radius:22px;padding:20px;margin:0 0 24px}.scanhero h2{font-size:19px;margin-bottom:12px}.scanhero .primary{display:flex;align-items:center;justify-content:center;gap:10px}.sheet video{width:100%;max-height:260px;background:#23382f;border-radius:18px}.lookupstatus{font-size:14px;color:#65796b}.sheet .busytext{padding:20px 0}.cameraDialog{z-index:8}.notice.warn{background:#fff0d8}.bad{color:#ab3f32}.iconbutton{width:38px;height:38px;border-radius:50%;background:#eaf0e7;font-size:18px}.unitline{display:flex;gap:12px;align-items:center}.unitline input{flex:1}.unitline select{width:110px}

.searchwrap{position:relative;margin-bottom:22px}.searchwrap input{display:block;margin-bottom:0;padding-right:52px}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}.clearsearch{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:28px;height:28px;padding:0;border:1px solid #bdcbbf;border-radius:50%;background:#eaf0e7;color:#356049;font-size:21px;line-height:1;display:grid;place-items:center}.clearsearch[hidden]{display:none}

.groupname{flex:1;min-width:0;text-align:left;background:none;padding:0;color:inherit;font-size:22px;font-weight:650;overflow-wrap:anywhere}.groupname span{font-size:17px;color:var(--green);margin-left:5px}

.photoart{background:white!important;overflow:hidden}.photoart img{width:100%;height:100%;object-fit:contain;padding:5px}.photobutton{position:relative;border:0;background:none;padding:0}.photobutton>span{position:absolute;bottom:-4px;right:-5px;background:white;border:1px solid var(--line);border-radius:50%;padding:4px;font-size:14px}.uploadlabel{background:white;border:1px solid var(--line);border-radius:14px;padding:16px}.uploadlabel input{margin-top:10px;font-size:13px}

.swipeRow{position:relative;overflow:hidden;border-radius:18px;margin:0 0 12px;background:#b94038;touch-action:pan-y}.swipeFront{position:relative;transform:translateX(var(--swipe,0px));transition:transform .2s ease;background:var(--bg,#f5f6f0);border-radius:18px}.swipeFront .card{margin:0;width:100%}.swipeDelete{position:absolute;inset:0 0 0 auto;width:92px;border:0;border-radius:0;background:#b94038;color:white;font-weight:650;padding:10px}.swipeDragging .swipeFront{transition:none}.swipeFull,.swipeFull .swipeDelete{background:#9c2c27}.swipeRow:has(.swipeDelete:focus-visible) .swipeFront{transform:translateX(-92px)}.toast[popover]{inset:auto;margin:0;top:15px;left:50%;border:0}.toast button{margin-left:14px;background:white;color:#243e34;border:0;border-radius:9px;padding:8px 12px;font-weight:650}

.danger{background:#b94038;color:white}

.willyslink{display:block;text-align:center;text-decoration:none}

.swipeAdd{position:absolute;inset:0 auto 0 0;width:92px;border:0;border-radius:0;background:#236448;color:white;font-size:13px;font-weight:650;padding:10px}.swipeRight{background:#236448}.swipeRight.swipeFull,.swipeRight.swipeFull .swipeAdd{background:#174d35}.swipeRow:has(.swipeAdd:focus-visible) .swipeFront{transform:translateX(92px)}

.shopSwipe .shoprow{margin:0}.shopSwipe .swipeFront{background:#f5f6f0}

.toast[hidden]{display:none!important}.settingsgear{font-size:24px!important;text-decoration:none!important;min-width:44px;min-height:44px}.activityrow{padding:16px 0;border-bottom:1px solid var(--line)}.activityrow strong{display:block;font-size:15px}.activityrow .secondary{margin-top:10px}

.orderGhost{z-index:10000;pointer-events:none;box-shadow:0 18px 40px #17372c44;transform:scale(1.025);border:2px solid #236448;background:#fff;opacity:.98}.orderPlaceholder{opacity:.18;outline:2px dashed #23644855;outline-offset:-2px}.swipeFront{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.orderhint{font-size:13px;margin:8px 0 16px}

.scanquantity{display:flex;gap:12px;align-items:center;margin:12px 0 20px}.scanquantity button{width:56px;flex-shrink:0;margin:0;font-size:26px}.scanquantity input{min-width:0;text-align:center;font-size:24px}

.homecounter{display:flex;align-items:center;justify-content:center;gap:16px;margin:22px 0}.counterstep{width:38px;height:38px;min-height:38px;border:1px solid #dce4da;border-radius:50%;background:#f0f4ed;color:#236448;font-size:23px;line-height:1;padding:0}.counterstep:disabled{opacity:.35}.countervalue{border:0;background:transparent;color:inherit;padding:4px 8px;text-align:center}.countervalue strong{display:block;font-size:25px}.countervalue span{display:block;font-size:13px;color:#6b7567}

.ordermenu{display:block;background:transparent;border:0;color:#536e5c;font-size:14px;padding:10px 0;margin:0 0 12px;text-align:left}.ordermenu span{margin-left:8px}

.swipeDelete,.swipeAdd{font-size:13px;line-height:1.35;font-weight:650}

.action small{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:5px;line-height:1.4}

.listfilters{display:flex;gap:8px;align-items:center}.listfilters select{flex:1;min-width:0}.listfilters .ordermenu{flex:1}.departmentHeading{display:flex;justify-content:space-between;width:100%;background:transparent;color:var(--ink);font-size:18px;font-weight:650;padding:20px 4px 8px;border:0}.departmentHeading span{font-size:13px;color:var(--muted)}

.inlinecount{flex:1;min-width:0;display:flex;align-items:center;gap:6px;margin:0}.inlinecount input{width:100%;min-width:0;margin:0;text-align:center;font-size:28px;padding:10px 4px}.inlinecount .secondary{width:auto;margin:0;padding:10px}.inlinecount .close{flex-shrink:0}

.orderDepartment.orderPlaceholder{opacity:.3}.departmentHeading{user-select:none;-webkit-user-select:none}.orderGhost.departmentHeading{background:#fff;border-radius:14px;box-shadow:0 12px 32px #0003;padding:16px;z-index:9999}

.departmentbar{display:flex;align-items:center;gap:8px}.departmentbar .departmentHeading{flex:1}.departmentbar .smallbutton{margin:0;flex:0 0 44px;font-size:22px}

.app [hidden],.sheet [hidden]{display:none!important}

.name .groupbadge{font-size:13px;font-weight:400;color:var(--muted);white-space:nowrap;}

.brandheading{display:flex;align-items:center;gap:10px;font-size:clamp(23px,6vw,29px);line-height:1.2}.brandmark{width:30px;height:30px;flex-shrink:0;}

/* Compact Home tools stay below the scan panel. */
.homecontrols{gap:8px;margin:12px 0 8px}.homecontrols .searchtoggle{display:grid;place-items:center;width:44px;min-width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--green)}
.homecontrols select,.homecontrols .ordermenu{height:44px;min-height:44px;margin:0;padding:0 28px 0 10px;border:1px solid var(--line);border-radius:12px;background-color:white;font-size:13px;font-weight:600;min-width:0;flex:1;color:#243e34}
.homecontrols select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m3 4 3 3 3-3' fill='none' stroke='%23748077' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.homecontrols .ordermenu{position:relative;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.homecontrols .ordermenu span{position:absolute;right:10px;top:50%;transform:translateY(-50%)}
.homesearch{margin:0 0 8px}.homesearch[hidden]{display:none}#results>.orderDepartment:first-child .departmentHeading{padding-top:10px}
/* Shared hierarchy for group and product detail cards. */
.cardhead{margin-bottom:14px}.cardkind{flex:1;font-size:11px;letter-spacing:.8px;color:var(--muted)}.cardidentity{display:flex;align-items:center;gap:16px;margin:0 0 22px}.cardidentity>div{min-width:0}.identityname{background:none;padding:0;text-align:left;font-size:25px;font-weight:700;letter-spacing:-.6px;overflow-wrap:anywhere}.identityname span{font-size:14px;color:var(--muted)}.cardidentity .art{width:70px;height:80px}.stockpanel{background:#edf2e9;border-radius:18px;padding:0 14px;margin-bottom:16px}.stockrow{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:76px}.stockrow+.stockrow{border-top:1px solid #dae3d6}.stocklabel{font-size:14px;font-weight:600}.stocklabel small{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:4px}.stockrow .homecounter{margin:0;padding:0;background:none;gap:3px;flex-shrink:0}.stockrow .counterstep{width:34px;height:34px;min-width:34px;background:white;border:0;border-radius:50%;font-size:21px}.stockrow .countervalue{padding:5px;min-width:38px;width:auto}.stockrow .countervalue strong{font-size:22px}.stocktotal{font-size:20px;text-align:right;overflow-wrap:anywhere}.stockguidance{margin:-6px 0 16px}.shoppingtoggle{width:100%;min-height:48px;border:1px solid #a8c2b0;border-radius:13px;background:white;color:var(--green);font-weight:650;margin-bottom:16px}.shoppingtoggle.selected{background:var(--green);color:white;border-color:var(--green)}.organiserows{margin-bottom:16px}.organiserows .action{border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:16px 0;min-height:52px;margin:0;font-size:14px;font-weight:400}.organiserows .action span:last-child{text-align:right;font-size:13px;color:var(--muted)}.cardextras{border-top:1px solid var(--line);margin-top:8px}.cardextras summary{font-weight:600;padding:17px 0}.carddelete{width:100%;background:none;border-top:1px solid var(--line);color:#b34840;font-size:13px;padding:18px 0 0;margin-top:12px}.stockrow:has(.inlinecount){flex-wrap:wrap;padding:10px 0}.stockrow:has(.inlinecount) .homecounter{width:100%;flex:1}.stockrow .inlinecount{flex:1;min-width:0}.stockrow .inlinecount input{min-width:50px;width:100%;font-size:26px}.stockrow .inlinecount .secondary{min-height:36px;padding:8px;width:auto}

/* Space between a field label and its control; checkbox/photo/inline controls keep their layout. */
label>input:not([type=checkbox]):not([type=hidden]):not([type=file]),label>select,label>textarea{margin-top:6px}

/* Shared interactive controls and modal scroll containment. */
summary,a[href],select:not(:disabled),input[type=checkbox]:not(:disabled),input[type=radio]:not(:disabled),label:has(input[type=checkbox]:not(:disabled)),label:has(input[type=radio]:not(:disabled)),.uploadlabel{cursor:pointer}
html:has(dialog[open]),body:has(dialog[open]){overflow:hidden;overscroll-behavior:none}
dialog{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
