/* Single viewport shell; only content areas scroll. */
html{height:100%;overscroll-behavior:none}
body[data-interface=customer]{height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column;overscroll-behavior:none;background:#f3f8fb}
body[data-interface=customer] header{position:relative;top:auto;flex:none;width:100%;max-width:960px;margin:0 auto;padding:12px 16px;min-height:66px;background:#f3f8fb}
body[data-interface=customer] header #brand{font-size:clamp(13px,2.6vw,20px);min-width:0;gap:6px;justify-content:center}
body[data-interface=customer] header .back{padding:8px;min-height:40px;border-radius:12px}
body[data-interface=customer] header #accountButton{width:40px;height:40px;min-height:40px;padding:8px;border-radius:12px}
body[data-interface=customer] header .bell-button{width:34px;min-width:34px;padding:5px}
body[data-interface=customer] #main{flex:1;min-height:0;width:100%;max-width:960px;margin:0 auto;padding:12px 16px;overflow-y:auto;overscroll-behavior:contain}
body[data-interface=customer].catalog-screen #main{display:flex;flex-direction:column;overflow:hidden;gap:9px}
.catalog-screen #main>.toolbar{margin:0;flex:none;gap:8px;flex-wrap:nowrap}
.catalog-screen #main h1{font-size:clamp(19px,4vw,26px);margin:0;line-height:1.3}
.catalog-screen .cart-action{min-height:39px;padding:7px 12px;border-radius:14px;gap:6px;font-size:12px;white-space:nowrap;box-shadow:none}
.catalog-screen .cart-action svg{width:20px;height:20px}
.catalog-screen .customer-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;flex:none;margin:0}
.catalog-screen .customer-actions #pointsSlot{display:flex;min-width:0}
.catalog-screen .customer-actions button,.catalog-screen #rewardButton{width:100%;min-width:0;height:38px;min-height:38px;margin:0;padding:5px 4px;font-size:clamp(10px,2.7vw,13px);white-space:normal;line-height:1.2;border-radius:10px}
.catalog-screen .searchline{flex:none;height:43px;min-height:43px;margin:0}
.catalog-screen .mode-picker{width:84px!important;min-width:84px!important;max-width:84px!important}
.catalog-screen .mode-picker #modeButton{font-size:12px;height:41px;padding:0 9px}
.catalog-screen .search-input-wrap #search{height:41px;min-height:41px;padding:8px 37px 8px 12px;font-size:14px}
.catalog-screen .search-input-wrap #search::placeholder{opacity:.65}
.catalog-screen .search-input-wrap #clear{width:34px;height:37px;min-height:37px;right:2px;top:2px;font-size:24px}
body[data-interface=customer].catalog-screen #suggestions{flex:none;height:auto;max-height:min(136px,22dvh)!important;min-height:0;margin:0;border-radius:12px;overflow-y:auto;overscroll-behavior:contain}
.catalog-screen #suggestions .suggestion{height:34px;min-height:34px;padding:6px 12px;font-size:12px}
.catalog-screen #catalogStatus{flex:none;font-size:11px;margin:0;line-height:16px}
body[data-interface=customer].catalog-screen #catalog.grid{flex:1;min-height:0;height:auto;max-height:none!important;width:100%;max-width:none;margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;overflow-y:auto;overscroll-behavior:contain;align-content:start;padding:0 3px 8px 0;scrollbar-width:thin}
body[data-interface=customer] .compact-product{height:82px;min-height:82px;padding:10px;gap:9px;border-radius:13px;background:#fff;box-shadow:0 2px 4px #21435104}
body[data-interface=customer] .compact-photo,body[data-interface=customer] .compact-product .photo{width:44px;height:54px;flex:none;object-fit:contain;margin:0}
body[data-interface=customer] .compact-product .product-summary{flex:1;min-width:0}
body[data-interface=customer] .compact-product .product-summary h3{font-size:12px;line-height:1.35;font-weight:650;margin:0 0 6px;overflow-wrap:anywhere}
body[data-interface=customer] .compact-product .pill{font-size:10px}
body[data-interface=customer] .medicine-watermark{font-size:7px;letter-spacing:.02em;overflow:hidden}
.catalog-screen #main>.toolbar:has(#moreProducts){flex:none;margin:0}
.catalog-screen #moreProducts{min-height:26px;padding:3px;font-size:11px;border-radius:9px}
.catalog-screen #up{display:none}
body[data-interface=customer] #nav{position:relative;inset:auto;flex:none;width:100%;max-width:960px;margin:0 auto;padding:8px 12px max(8px,env(safe-area-inset-bottom));overflow:hidden;border-radius:16px 16px 0 0;min-height:58px;gap:8px}
body[data-interface=customer] #nav button{flex:1;min-width:0;padding:10px;font-size:13px}
#notice,#notice:not(:empty){position:fixed;top:auto;bottom:78px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 32px);padding:7px 12px;font-size:12px;line-height:1.4;box-shadow:none;border-radius:8px;background:#edf7fa;color:#214351;pointer-events:none}
#notice:empty{display:none}
dialog{background:#fff;isolation:isolate;padding:46px 22px 22px!important;max-height:calc(100dvh - 24px);width:min(520px,calc(100vw - 24px));border-radius:18px}
dialog .dialog-x,dialog .scan-close{position:absolute;top:10px;right:10px;width:32px;height:32px;min-width:32px;min-height:32px;padding:0!important;border:0!important;border-radius:50%;background:#eff5f8;color:#2a7a9d;font:26px/1 system-ui;box-shadow:none;display:flex;align-items:center;justify-content:center;z-index:3}
dialog .dialog-x::before,dialog .dialog-x::after,dialog .scan-close::before,dialog .scan-close::after{content:none!important;display:none!important}
dialog h1,dialog h2{margin-top:0}
@media(max-width:430px){body[data-interface=customer] header{padding:9px 10px;gap:4px;min-height:60px}body[data-interface=customer] header .back span{display:none}body[data-interface=customer] header #brand{font-size:14px}body[data-interface=customer] #main{padding:10px}.catalog-screen .customer-actions{gap:6px}body[data-interface=customer] .compact-product{height:79px;min-height:79px;padding:8px;gap:6px}body[data-interface=customer] .compact-product .product-summary h3{font-size:11px}body[data-interface=customer] .compact-photo,body[data-interface=customer] .compact-product .photo{width:35px;height:46px}}
@media(max-height:500px){.catalog-screen .customer-actions button,.catalog-screen #rewardButton{height:30px;min-height:30px}body[data-interface=customer] header{min-height:48px;padding-top:4px;padding-bottom:4px}body[data-interface=customer].catalog-screen #main{gap:5px}body[data-interface=customer] #nav{min-height:42px;padding:3px}body[data-interface=customer] #nav button{padding:6px}}
body[data-interface=customer].search-active #nav{display:flex!important}
body[data-interface=customer]{height:var(--app-viewport,100dvh);max-height:var(--app-viewport,100dvh)}
body[data-interface=customer] #notice{bottom:70px}

body[data-interface=customer] #notice,body[data-interface=customer] #notice:not(:empty),body[data-interface=customer] #notice:empty{display:block;position:relative;inset:auto;transform:none;flex:none;box-sizing:border-box;width:100%;max-width:960px;height:20px;min-height:20px;margin:0 auto;padding:1px 16px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#2a7a9d}

.cart-source{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #d5e4ec}.cart-source>div:first-of-type{flex:1;min-width:0}.cart-source p{font-size:13px;overflow-wrap:anywhere;margin:5px 0}.source-thumb{width:64px;min-width:64px;height:70px;padding:4px;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:10px}.source-thumb img{width:100%;height:100%;object-fit:contain}.cart-source .toolbar{margin:0;gap:6px}.cart-groups{margin-top:24px}.cart-groups h2{font-size:19px}.confirm-available{font-size:12px;flex-basis:100%;background:#eef7fb;padding:10px;border-radius:8px}.draft-price{display:block}.availability.now-available{color:#6ebeea}.request-attachments{margin-bottom:16px}

/* 14.6: one cart entrance and compact customer controls. */
body[data-interface=customer] #nav button{display:flex;align-items:center;justify-content:center;gap:6px}
.nav-cart-count{background:#2a7a9d;color:white;border-radius:12px;min-width:20px;padding:2px 5px;font-size:11px}
.catalog-screen .customer-actions{display:flex;gap:14px;align-items:center}
.catalog-screen .customer-actions #pointsSlot{flex:none}
.catalog-screen .customer-actions button,.catalog-screen #rewardButton{width:auto;height:30px;min-height:30px;padding:4px 9px;font-size:12px;border-radius:8px}
body[data-interface=customer] .cart-panel{padding:12px;border-radius:12px;box-shadow:none}
body[data-interface=customer] .cart-row{padding:10px 0;gap:8px;min-height:0}
body[data-interface=customer] .cart-row .cart-photo,body[data-interface=customer] .draft-photo{width:38px;height:42px;flex:none}
body[data-interface=customer] .cart-row .photo{width:100%;height:100%;object-fit:contain}
body[data-interface=customer] .cart-name,body[data-interface=customer] .draft-name{font-size:13px;line-height:1.3}
body[data-interface=customer] .cart-row .availability{font-size:11px;margin:3px 0}
body[data-interface=customer] .cart-row .stepper button{width:28px;min-width:28px;height:30px;min-height:30px;padding:0}
body[data-interface=customer] .cart-row .stepper output{min-width:20px;font-size:12px}
body[data-interface=customer] .remove-line{width:28px;min-width:28px;min-height:30px;padding:4px}
body[data-interface=customer] .cart-source{padding:10px 0;gap:8px;font-size:13px}
body[data-interface=customer] .source-thumb{width:44px;min-width:44px;height:48px}
body[data-interface=customer] .cart-groups{margin-top:18px}
body[data-interface=customer] .cart-groups h2{font-size:16px;margin-bottom:8px}
body[data-interface=customer] .cart-groups .orderCard{padding:12px;min-height:0;border-radius:10px;margin:6px 0;box-shadow:none;font-size:13px;gap:4px}
body[data-interface=customer] .cart-groups .orderCard small{font-size:10px}
body[data-interface=customer] .text-action{background:transparent;color:#2a7a9d;border:0;box-shadow:none;padding:6px 0;min-height:32px;font-size:13px;flex:none}
.cart-empty{padding:12px 0;font-size:13px}.cart-history{margin-top:18px;color:#607b88;font-size:12px}.cart-history summary{cursor:pointer}
body[data-interface=customer] .cart-panel .total{font-size:16px;padding:12px 0}
body[data-interface=customer] .cart-panel #saveOrder{min-height:40px;padding:8px 14px;font-size:14px;flex:0 1 auto;margin-left:auto}
/* 14.7 customer layout: header, greeting/cart, three light actions, search and scrollable results. */
body[data-interface=customer] #nav{display:none!important}
body[data-interface=customer] header{padding:8px 10px;min-height:58px;gap:6px}
body[data-interface=customer] header .back{display:flex;align-items:center;gap:3px;padding:6px;font-size:11px;min-height:36px}
body[data-interface=customer] header .back span{display:inline!important}
body[data-interface=customer] header .back svg{width:17px;height:17px}
body[data-interface=customer] header #brand{font-size:clamp(12px,3vw,19px);gap:3px;flex:1}
body[data-interface=customer] header #brand .crescent{width:34px;height:38px;min-width:34px}
body[data-interface=customer] header #accountButton{width:34px;height:36px;min-height:36px;padding:6px}
body[data-interface=customer] header .bell-button{width:30px;min-width:30px;height:34px;padding:4px}
body[data-interface=customer] #main{padding:6px 10px}
body[data-interface=customer].catalog-screen #main{gap:6px}
body[data-interface=customer] #notice:empty{height:0;min-height:0;padding:0}
.catalog-screen .customer-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin-bottom:2px}
.catalog-screen .customer-actions #pointsSlot{display:flex}
.catalog-screen .customer-actions button,.catalog-screen #rewardButton,.catalog-screen .cart-action{background:#e9f4f8;color:#347c98;border:1px solid #bedce8;box-shadow:none;min-height:34px;height:34px;width:100%;padding:5px 6px;font-size:11px;border-radius:9px}
.catalog-screen .cart-action{width:auto;min-height:32px;height:32px;padding:5px 10px}
.catalog-screen .cart-action .cart-count{background:#fff;color:#347c98}
#customerOrders{display:flex;gap:4px;align-items:center;justify-content:center}#customerOrders svg{width:17px;height:19px}
.catalog-screen .searchline{border:1.5px solid #8ab8cb;border-radius:10px;overflow:visible;margin:0;height:40px;min-height:40px}
.catalog-screen .mode-picker{width:80px!important;min-width:80px!important;max-width:80px!important}
.catalog-screen .mode-picker #modeButton{display:flex;justify-content:flex-start;gap:5px;padding:0 7px;font-size:11px;height:37px}
.catalog-screen .search-input-wrap #search{height:37px;min-height:37px;font-size:16px;padding:5px 44px 5px 9px;outline:none!important;box-shadow:none!important;border:0!important;background:transparent}
.catalog-screen .searchline:focus-within{border-color:#4c96b4;box-shadow:0 0 0 2px #2a7a9d12}
.catalog-screen .search-input-wrap #clear{right:8px;top:1px;width:32px;height:34px;min-height:34px;background:transparent;color:#6b9db1}
body[data-interface=customer].catalog-screen #suggestions{margin-top:-6px;border-radius:0 0 9px 9px;border-top:0;max-height:136px!important;height:136px!important;flex:0 0 136px}
body[data-interface=customer].catalog-screen #suggestions[hidden]{display:none!important}
body[data-interface=customer].catalog-screen #suggestions .suggestion{height:34px;min-height:34px}
body[data-interface=customer].catalog-screen #catalogStatus:empty,body[data-interface=customer].catalog-screen #catalogStatus:not(:empty){display:none}
body[data-interface=customer].catalog-screen #catalog.grid{gap:8px;grid-auto-rows:76px;align-content:start;padding-top:0}
body[data-interface=customer] .compact-product{height:76px;min-height:76px;padding:7px;gap:6px}
body[data-interface=customer] .compact-product .product-summary h3{font-size:11px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:5px}
body[data-interface=customer] .compact-photo{width:34px;height:44px}
body[data-interface=customer] .compact-product .plus{display:none}
.catalog-screen #main>.toolbar:has(#moreProducts){display:none}
.menu-backdrop{position:fixed;inset:0;z-index:999;background:transparent}
#workspaceSettings{position:fixed;z-index:1000;top:calc(env(safe-area-inset-top) + 62px);right:10px;width:min(290px,calc(100vw - 20px));padding:42px 12px 12px;background:#f3fafc;border:1px solid #c7dfe9;border-radius:16px;box-shadow:0 8px 30px #21435120}
#workspaceSettings .menu-close{position:absolute;top:6px;right:8px;width:34px;height:34px;min-height:34px;padding:0;border:0;border-radius:8px;background:transparent;color:#6a9fb4;font-size:30px;line-height:1}
#workspaceSettings .menu-row{min-height:44px;padding:8px;gap:12px;font-size:14px}#workspaceSettings .menu-row svg{width:30px;height:30px}
dialog:has(.points-dialog){width:min(300px,calc(100vw - 32px));padding:38px 20px 20px!important;background:linear-gradient(120deg,#ecf8ff,#fff7df);text-align:center}
.points-dialog{padding:0!important;margin:0!important}.points-dialog strong{font-size:30px;color:#2a7a9d}.points-dialog small{font-size:14px}
body[data-interface=customer] .cart-panel{background:transparent;border:0;padding:4px 0;box-shadow:none}
body[data-interface=customer] .cart-panel .toolbar{align-items:center;gap:8px}
body[data-interface=customer] #confirmDraft{min-height:38px;padding:8px 12px;font-size:14px}
body[data-interface=customer] .confirm-available{padding:6px 0;background:transparent;font-size:12px}
.notification-panel .notification-row{padding:10px;min-height:0;box-shadow:none;font-size:13px}.notification-row strong{font-size:13px}.notification-row small{font-size:10px}

.catalog-screen .customer-actions #quickRequest{background:#e9f4f8;color:#347c98;border-color:#bedce8}
dialog:has(.points-dialog)::backdrop{pointer-events:auto}
body[data-interface=customer].search-active #nav{display:none!important}

body[data-interface=customer] #draftBack{display:none}