.matrix-pos-muffin,.matrix-pos-mug,.matrix-pos-register{position:absolute;left:0;top:0;margin:0;padding:0;border:0;transform-origin:0 0;background:transparent;z-index:6;touch-action:none;backface-visibility:hidden}
.matrix-pos-muffin{width:80px;height:70px;cursor:grab}.matrix-pos-mug{width:90px;height:64px;cursor:grab}.matrix-pos-register{width:200px;height:180px;cursor:pointer}
.matrix-pos-muffin[hidden],.matrix-pos-mug[hidden],.matrix-pos-register[hidden],.matrix-pos-basket[hidden]{display:none}
.matrix-pos-muffin:hover,.matrix-pos-muffin:focus-visible,.matrix-pos-muffin.media-picked,.matrix-pos-mug:hover,.matrix-pos-mug:focus-visible,.matrix-pos-mug.media-picked,.matrix-pos-mug.is-held{outline:2px solid #b5f2d8;outline-offset:-2px;border-radius:8px;background:#b5f2d80a}
.matrix-pos-register.is-pos-drop-target,.matrix-pos-register:focus-visible{outline:4px solid #b5f2d8;outline-offset:-4px;border-radius:8px;background:#b5f2d815}
.matrix-pos-basket{position:absolute;bottom:16px;left:16px;z-index:9;width:min(310px,calc(100% - 32px));max-height:46%;overflow:auto;padding:14px;box-sizing:border-box;border:1px solid #739b8b;border-radius:12px;background:#102920f5;color:#edf7ee;font:14px/1.5 system-ui;box-shadow:0 12px 38px #0007}
.matrix-pos-basket header{display:flex;align-items:center;justify-content:space-between;gap:8px}.matrix-pos-basket h2{margin:0;font-size:18px}.matrix-pos-scope{margin:0 0 10px;color:#b0c7bb;font-size:11px}
.matrix-pos-basket button{border:1px solid #779f8d;border-radius:7px;background:#183d2f;color:#effff5;padding:7px 10px;font:13px system-ui;cursor:pointer}.matrix-pos-basket .matrix-pos-close{font-size:22px;line-height:1;padding:3px 8px}
.matrix-pos-lines{list-style:none;margin:0;padding:0}.matrix-pos-lines li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid #60806f55}.matrix-pos-lines button{padding:3px 7px;font-size:11px}
.matrix-pos-offer{margin-top:12px;padding:10px;background:#d8ead512;border:1px solid #8aab7755;border-radius:8px}.matrix-pos-offer p{margin:0 0 8px}.matrix-pos-offer button{margin-right:5px;margin-bottom:4px}.matrix-pos-offer button:first-of-type{background:#d3e5bd;color:#153122;border-color:#d3e5bd}.matrix-pos-status{margin:8px 0 0;color:#b5f2d8;font-size:11px}
.matrix-pos-silhouette{width:100%;height:100%;overflow:visible;pointer-events:none;opacity:0}.matrix-pos-silhouette path{fill:#c7ffd519;stroke:#d6ff91;stroke-width:3;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 3px #87ff6a)}.matrix-pos-muffin.is-demo-outline{outline:0;background:transparent}.is-demo-outline .matrix-pos-silhouette{opacity:1}.matrix-pos-muffin.is-demo-picked{background:#10292066}
.matrix-pos-demo-ghost{position:absolute;z-index:11;width:76px;height:78px;pointer-events:none;transform:translate(-50%,-60%);filter:drop-shadow(0 8px 8px #000a)}.matrix-pos-demo-ghost img{width:100%;height:100%;object-fit:cover;object-position:top;clip-path:polygon(0 18%,20% 0,75% 0,100% 25%,97% 68%,78% 86%,22% 92%,2% 74%)}
.matrix-pos-demo-banner{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:12;display:flex;align-items:center;gap:12px;max-width:calc(100% - 28px);box-sizing:border-box;padding:9px 12px;border:1px solid #8bad75;border-radius:10px;background:#102920f2;color:#eff9e4;font:13px/1.4 system-ui}.matrix-pos-demo-banner button{flex-shrink:0;border:1px solid #759a6a;border-radius:6px;background:#25432c;color:inherit;padding:6px 8px;cursor:pointer}.matrix-pos-demo-banner[hidden],.matrix-pos-demo-ghost[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.matrix-pos-silhouette path{filter:none}}

.matrix-water-rack{position:absolute;left:0;top:0;width:440px;height:350px;transform-origin:0 0;z-index:7;backface-visibility:hidden;pointer-events:none}
.matrix-water-rack[hidden],.matrix-water-bottle[hidden]{display:none}
.matrix-water-pile{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 52%,#11191d 57%,#171c1c 65%,transparent 71%);border-radius:48%;}
.matrix-water-pile canvas{position:absolute;inset:0;pointer-events:none;mask-image:radial-gradient(ellipse at 50% 52%,#000 65%,transparent 73%)}
.matrix-water-bottle{position:absolute;width:48px;height:92px;margin:0;padding:0;border:0;background:transparent;border-radius:35%;cursor:grab;touch-action:none;pointer-events:auto}
.matrix-water-bottle:hover,.matrix-water-bottle:focus-visible{outline:3px solid #d9ffc3;background:#d9ffc31a}
.matrix-water-count{position:absolute;left:55px;bottom:-24px;width:330px;padding:8px 12px;border:1px solid #c3efdd;background:#003b32;color:white;font:bold 20px Arial;border-radius:8px;pointer-events:auto}
.matrix-water-nav{position:absolute;bottom:26px;left:16px;z-index:9;padding:8px 14px;border:1px solid #b7dfcd;border-radius:20px;background:#003b32e8;color:#fff;font:600 13px Arial;cursor:pointer}
.matrix-water-offer{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important;background:#003b32!important;z-index:18!important;pointer-events:none!important}