/* The paper bag is the entire order overlay. */
#bag-drawer{--bag:#cb4426;inset:18px 0 auto;margin:0 auto;width:min(560px,calc(100vw - 34px));height:calc(100dvh - 36px);max-height:960px;max-width:none;overflow:visible;border:0;border-radius:0;background:none;color:var(--paper);box-shadow:none;isolation:isolate;perspective:1000px}
#bag-drawer[open]{display:flex;flex-direction:column;animation:paper-in .32s ease-out both}
#bag-drawer::backdrop{background:#26311d73;backdrop-filter:none}
#bag-drawer.is-closing{animation:paper-out .22s ease-in both}
.bag-mouth,.bag-surface,.bag-gusset,.bag-bottom-fold,.bag-fold,.bag-seal{position:absolute;pointer-events:none}
.bag-mouth{z-index:-2;inset:0 5px auto;height:45px;background:#a8331d;clip-path:polygon(0% 0px,2% 7px,4% 0px,6% 7px,8% 0px,10% 7px,12% 0px,14% 7px,16% 0px,18% 7px,20% 0px,22% 7px,24% 0px,26% 7px,28% 0px,30% 7px,32% 0px,34% 7px,36% 0px,38% 7px,40% 0px,42% 7px,44% 0px,46% 7px,48% 0px,50% 7px,52% 0px,54% 7px,56% 0px,58% 7px,60% 0px,62% 7px,64% 0px,66% 7px,68% 0px,70% 7px,72% 0px,74% 7px,76% 0px,78% 7px,80% 0px,82% 7px,84% 0px,86% 7px,88% 0px,90% 7px,92% 0px,94% 7px,96% 0px,98% 7px,100% 0px,98% 100%,2% 100%)}
.bag-surface{z-index:-1;inset:12px 0 0;background:var(--bag);clip-path:polygon(0% 0px,2% 7px,4% 0px,6% 7px,8% 0px,10% 7px,12% 0px,14% 7px,16% 0px,18% 7px,20% 0px,22% 7px,24% 0px,26% 7px,28% 0px,30% 7px,32% 0px,34% 7px,36% 0px,38% 7px,40% 0px,42% 7px,44% 0px,46% 7px,48% 0px,50% 7px,52% 0px,54% 7px,56% 0px,58% 7px,60% 0px,62% 7px,64% 0px,66% 7px,68% 0px,70% 7px,72% 0px,74% 7px,76% 0px,78% 7px,80% 0px,82% 7px,84% 0px,86% 7px,88% 0px,90% 7px,92% 0px,94% 7px,96% 0px,98% 7px,100% 0px,100% 95%,97% 100%,3% 100%,0 95%);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.045'/%3E%3C/svg%3E")}
.bag-gusset{z-index:0;top:28px;bottom:7px;width:16px;background:#b53a21}.bag-left{left:0;clip-path:polygon(0 0,100% 5%,60% 96%,100% 100%,0 96%)}.bag-right{right:0;clip-path:polygon(100% 0,0 5%,40% 96%,0 100%,100% 96%)}
.bag-bottom-fold{z-index:0;left:16px;right:16px;bottom:17px;height:15px;border-bottom:1px solid #f8e4cc45;clip-path:polygon(0 0,50% 80%,100% 0,100% 100%,0 100%);background:#af371b35}
#bag-drawer .drawer-head,#bag-drawer .drawer-content,#bag-drawer .drawer-actions{position:relative;z-index:1;background:transparent;color:var(--paper)}
#bag-drawer .drawer-head{border:0;padding:29px 34px 17px;flex-shrink:0}
#bag-drawer .drawer-tools{margin-bottom:12px;min-height:36px}
#bag-drawer .drawer-brand{color:var(--paper);font-size:16px}
#bag-drawer .drawer-close,#bag-drawer .drawer-back{color:var(--paper);background:none;border:0}
#bag-drawer .drawer-close{width:42px;height:42px}
#bag-drawer .drawer-head h2{font-size:57px;letter-spacing:-1.6px;color:var(--paper)}
#bag-drawer .drawer-head>p{color:var(--paper);font-size:13px;margin-top:9px}
#bag-drawer .drawer-content{padding:0 34px;scrollbar-color:#f4dabd80 transparent;scrollbar-width:thin}
#bag-drawer .drawer-actions{border:0;margin:0 34px;padding:15px 0 33px;flex-shrink:0}
#bag-drawer .drawer-actions:before{content:'';display:block;border-top:1px solid #fff9ec65;margin-bottom:15px}
#bag-drawer .bag-fineprint{color:var(--paper);font-size:12px;line-height:1.6}
#bag-drawer .button{background:var(--ink);color:var(--paper);border:0;box-shadow:none;min-height:48px;font-size:15px}
#bag-drawer .button:hover{background:#1c2714}
#bag-drawer button:focus-visible,#bag-drawer a:focus-visible{outline:2px solid var(--paper);outline-offset:4px}
#bag-drawer .text-link{color:var(--paper);background:none;font-size:13px}
#bag-drawer .bag-total>span:first-child{font-size:24px}
#bag-drawer .bag-total>span:last-child{font-size:13px}
#bag-drawer .bag-item{grid-template-columns:76px 1fr;gap:15px;padding:22px 30px 22px 0;border-bottom:1px solid #fff9ec60;color:var(--paper)}
#bag-drawer .bag-item>img{width:76px;height:82px;border:0;border-radius:3px;object-fit:cover}
#bag-drawer .bag-item h3{color:var(--paper);font-size:27px}
#bag-drawer .bag-item p{color:var(--paper);font-size:12px;line-height:1.6}
#bag-drawer .qty{border:1px solid #fff9ec80;background:none;color:var(--paper)}
#bag-drawer .qty button{color:var(--paper);background:none;width:35px;height:35px}
#bag-drawer .qty button:hover{background:#fff9ec18}
#bag-drawer .bag-remove{color:var(--paper);right:-8px;top:14px;width:44px;height:44px}
#bag-drawer .bag-featured{display:block;padding:2px 0 23px}
#bag-drawer .bag-featured>img{width:100%;height:auto;aspect-ratio:1.65;object-fit:cover;display:block;margin:0 0 16px;border-radius:3px}
#bag-drawer .bag-featured .bag-item-info{padding-right:33px}
#bag-drawer .bag-featured h3{font-size:35px;margin-bottom:8px}
#bag-drawer .bag-featured .bag-remove{top:auto;bottom:67px}
#bag-drawer .bag-featured .qty{margin-top:14px}
#bag-drawer .bag-add-more{margin-top:17px;margin-bottom:20px}
#bag-drawer .bag-empty,#bag-drawer .bag-empty>svg,#bag-drawer .bag-empty>p{color:var(--paper)}
#bag-drawer .bag-empty{padding:35px 8px 45px}
#bag-drawer .bag-lead{margin-top:8px;color:var(--paper);font-size:15px}
#bag-drawer .field,#bag-drawer .field>span{color:var(--paper);font-size:13px}
#bag-drawer .field input,#bag-drawer .field textarea{border:0;background:var(--paper);color:var(--ink);border-radius:3px;min-height:49px}
#bag-drawer .field input:focus,#bag-drawer .field textarea:focus{outline:2px solid var(--ink);outline-offset:3px}
#bag-drawer[data-view='resumen'] .drawer-head h2{font-size:44px}
#bag-drawer[data-view='resumen'] .drawer-head>p{display:none}
.order-receipt{background:var(--paper);color:var(--ink);padding:18px 20px 27px;margin:6px 9px 20px;position:relative;animation:receipt-rise .35s ease-out both}
.order-receipt:after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:8px;background:var(--paper);clip-path:polygon(0% 0px,2% 7px,4% 0px,6% 7px,8% 0px,10% 7px,12% 0px,14% 7px,16% 0px,18% 7px,20% 0px,22% 7px,24% 0px,26% 7px,28% 0px,30% 7px,32% 0px,34% 7px,36% 0px,38% 7px,40% 0px,42% 7px,44% 0px,46% 7px,48% 0px,50% 7px,52% 0px,54% 7px,56% 0px,58% 7px,60% 0px,62% 7px,64% 0px,66% 7px,68% 0px,70% 7px,72% 0px,74% 7px,76% 0px,78% 7px,80% 0px,82% 7px,84% 0px,86% 7px,88% 0px,90% 7px,92% 0px,94% 7px,96% 0px,98% 7px,100% 0px,100% 0,0 0);transform:rotate(180deg)}
.receipt-photo{display:block;width:100%;height:auto;aspect-ratio:2;object-fit:cover}
.receipt-kicker{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;margin-top:18px}
.order-receipt h3{font-size:44px;letter-spacing:-1px;margin:8px 0 20px}
.receipt-row{padding:13px 0;border-bottom:1px dashed #9aa58a}
.receipt-row b{font-size:16px;font-weight:500}
.receipt-row p{font-size:12px;line-height:1.7;margin-top:5px;color:#4b593c}
.receipt-note{font-style:italic}
.receipt-delivery{padding:18px 0;border-bottom:1px solid #a4ae92}
.receipt-delivery h4{font-size:14px;font-weight:600;margin:0 0 10px}
.receipt-delivery p{font-size:13px;line-height:1.7}
.receipt-total{display:flex;justify-content:space-between;gap:16px;margin:18px 0;font-size:14px}
.receipt-caption{font-size:11px;line-height:1.7;color:#4b593c}
#bag-drawer[data-view='resumen'] .drawer-actions{padding-top:3px}
#bag-drawer[data-view='resumen'] .drawer-actions:before{display:none}
#bag-drawer[data-view='resumen'] .drawer-actions>.text-link{margin-bottom:0}
#bag-drawer[data-view='resumen'] .drawer-actions>.bag-fineprint{margin-bottom:0;text-align:center;font-size:11px}
.bag-fold{z-index:5;left:13px;right:13px;top:20px;height:105px;background:#b83920;border-bottom:1px solid #9f301d;clip-path:polygon(0 0,100% 0,98% 90%,50% 100%,2% 90%);transform-origin:center top;transform:rotateX(-100deg);opacity:0;transition:transform .65s .12s ease,opacity .15s .12s ease}
.bag-seal{z-index:6;left:calc(50% - 27px);top:45px;width:54px;height:130px;background:var(--paper);display:grid;place-items:center;opacity:0;transform:translateY(-15px);transition:opacity .25s .5s,transform .25s .5s}
.seal-wordmark{width:94px;height:37px;overflow:hidden;transform:rotate(90deg);filter:brightness(0) saturate(100%) invert(34%) sepia(90%) saturate(2832%) hue-rotate(349deg) brightness(100%) contrast(92%)}
#bag-drawer.is-packing .packed-message>.button,#bag-drawer.is-packing .packed-message>.text-link{pointer-events:none}
#bag-drawer.is-packing .bag-fold,#bag-drawer[data-view='sellado'] .bag-fold{opacity:1;transform:rotateX(0)}
#bag-drawer.is-packing .bag-seal,#bag-drawer[data-view='sellado'] .bag-seal{opacity:1;transform:translateY(0)}
#bag-drawer[data-view='sellado']{height:min(600px,calc(100dvh - 50px));top:25px;width:min(440px,calc(100vw - 34px))}
#bag-drawer[data-view='sellado'] .drawer-head{position:absolute;width:100%;height:64px;top:0;padding:15px 22px;z-index:8}
#bag-drawer[data-view='sellado'] .drawer-brand,#bag-drawer[data-view='sellado'] .drawer-head>p{display:none}
#bag-drawer[data-view='sellado'] .drawer-head h2{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%)}
#bag-drawer[data-view='sellado'] .drawer-tools{justify-content:flex-end}
#bag-drawer[data-view='sellado'] .drawer-content{display:flex;align-items:center;justify-content:center;padding-top:190px;padding-bottom:38px}
.packed-message{text-align:center}.packed-message h3{font-size:44px;letter-spacing:-1.2px;line-height:1.05;margin-bottom:20px}.packed-message>p{font-size:15px;margin:15px 0}.packed-message>.button{margin:8px 0}.packed-message>.text-link{display:block;border:0;margin:10px auto;padding:5px}.packed-message>.bag-fineprint{font-size:12px;margin:12px 0}
@keyframes paper-in{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}@keyframes paper-out{to{opacity:0;transform:translateY(35px)}}@keyframes receipt-rise{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){
#bag-drawer{inset:14px 0 auto;width:calc(100vw - 22px);height:calc(100dvh - 28px);max-height:none;border:0;border-radius:0}
.bag-gusset{width:11px}.bag-mouth{inset-inline:3px}.bag-bottom-fold{inset-inline:11px;bottom:12px}
#bag-drawer .drawer-head{padding:25px 24px 13px}#bag-drawer .drawer-head:before{display:none}
#bag-drawer .drawer-tools{margin-bottom:7px;min-height:36px}#bag-drawer .drawer-head h2{font-size:47px}#bag-drawer .drawer-head>p{font-size:12px}
#bag-drawer .drawer-content{padding:0 24px}#bag-drawer .drawer-actions{margin:0 24px;padding:12px 0 max(27px,env(safe-area-inset-bottom))}
#bag-drawer .drawer-actions:before{margin-bottom:13px}#bag-drawer .drawer-actions .button{font-size:14px;min-height:47px}
#bag-drawer .bag-item{grid-template-columns:64px 1fr;gap:12px;padding-top:17px;padding-bottom:17px}#bag-drawer .bag-item>img{width:64px;height:72px}
#bag-drawer .bag-featured{display:block;padding-top:2px}#bag-drawer .bag-featured>img{width:100%;height:auto;aspect-ratio:1.6;margin-bottom:13px}
#bag-drawer .bag-item h3{font-size:25px}#bag-drawer .bag-featured h3{font-size:31px}#bag-drawer .bag-fineprint{font-size:11px;margin:8px 0 13px}
#bag-drawer .bag-featured .bag-remove{bottom:61px}#bag-drawer .field input,#bag-drawer .field textarea{font-size:16px}
#bag-drawer .bag-lead{font-size:14px}#bag-drawer[data-view='resumen'] .drawer-head h2{font-size:36px}
.order-receipt{padding:14px 15px 22px;margin:5px 2px 18px}.receipt-kicker{font-size:9px}.order-receipt h3{font-size:38px;margin-bottom:11px}.receipt-row b{font-size:15px}.receipt-delivery p{font-size:12px}.receipt-total{font-size:13px}
.bag-fold{left:9px;right:9px;height:95px}.bag-seal{height:120px;top:40px}
#bag-drawer[data-view='sellado']{top:35px;height:min(580px,calc(100dvh - 70px));width:calc(100vw - 34px)}
#bag-drawer[data-view='sellado'] .drawer-content{padding-top:175px}.packed-message h3{font-size:39px}
}
@media(max-height:650px){#bag-drawer .drawer-head{padding-top:23px}#bag-drawer .drawer-tools{margin-bottom:3px}#bag-drawer .drawer-head h2{font-size:40px}#bag-drawer .drawer-head>p{margin-top:5px}#bag-drawer .drawer-actions{padding-bottom:23px}.bag-fold{height:75px}.bag-seal{height:90px}#bag-drawer[data-view='sellado'] .drawer-content{padding-top:135px}.packed-message h3{font-size:34px}}
@media(prefers-reduced-motion:reduce){#bag-drawer[open],#bag-drawer.is-closing,.order-receipt{animation:none!important}.bag-fold,.bag-seal,#bag-drawer.is-packing .drawer-head,#bag-drawer.is-packing .drawer-content,#bag-drawer.is-packing .drawer-actions{transition:none!important}}
/* Keep the seal centered and the folded mouth visibly closed. */
.bag-seal{display:flex;align-items:center;justify-content:center}
.seal-wordmark{flex-shrink:0}
#bag-drawer[data-view='sellado'] .bag-mouth{opacity:0}
#bag-drawer[data-view='sellado'] .bag-surface{clip-path:polygon(2% 0,98% 0,100% 95%,97% 100%,3% 100%,0 95%)}
#bag-drawer[data-view='sellado'] .bag-fold{top:12px}

/* Multi-item orders stay readable; the folded bag becomes compact. */
body.bag-open #floating-bag{visibility:hidden;pointer-events:none}
#bag-drawer .drawer-content{scroll-padding-top:12px;scrollbar-gutter:stable}
#bag-drawer .drawer-head{padding-bottom:14px}
#bag-drawer .drawer-head:after{content:'';position:absolute;left:34px;right:34px;bottom:6px;border-bottom:1px solid #fff9ec35}
#bag-drawer[data-view='pedido'] .drawer-content{padding-top:8px}
#bag-drawer .drawer-actions:before{border-top:0;margin-bottom:0}
#bag-drawer .drawer-actions{border-top:1px solid #fff9ec55}
#bag-drawer[data-view='resumen'] .drawer-actions{border:0}
#bag-drawer.has-many .bag-featured>img{max-height:180px;aspect-ratio:2.5}
#bag-drawer.has-many .bag-item p{font-size:12px;line-height:1.5}
#bag-drawer.has-many .bag-featured .qty{margin-top:10px}
#bag-drawer.has-many .bag-featured{padding-bottom:15px}
#bag-drawer .bag-featured .bag-remove{top:auto;bottom:55px}
#bag-drawer[data-view='sellado']{inset:0;margin:auto;height:min(465px,calc(100dvh - 50px));width:min(365px,calc(100vw - 42px))}
#bag-drawer[data-view='sellado'] .drawer-head:after{display:none}
#bag-drawer[data-view='sellado'] .bag-fold{height:80px}
#bag-drawer[data-view='sellado'] .bag-seal{top:32px;height:105px;width:46px;left:calc(50% - 23px)}
#bag-drawer[data-view='sellado'] .seal-wordmark{width:78px;height:31px}
#bag-drawer[data-view='sellado'] .drawer-content{padding:155px 26px 27px;overflow-y:auto}
#bag-drawer .packed-message h3{font-size:35px;margin-bottom:12px}
#bag-drawer .packed-message>p{font-size:13px;margin:10px 0}
#bag-drawer .packed-message>.button{font-size:14px;min-height:44px;margin:8px 0}
#bag-drawer .packed-message>.text-link{margin:6px auto;font-size:12px;min-height:32px}
#bag-drawer .packed-message>.bag-fineprint{font-size:11px;margin:7px 0}
@media(max-width:700px){
 #bag-drawer .drawer-head{padding:22px 24px 12px}
 #bag-drawer .drawer-tools{margin-bottom:0;min-height:31px}
 #bag-drawer .drawer-brand{font-size:14px}
 #bag-drawer .drawer-close{height:36px}
 #bag-drawer .drawer-head h2{font-size:39px}
 #bag-drawer .drawer-head>p{margin-top:7px}
 #bag-drawer .drawer-head:after{left:24px;right:24px;bottom:3px}
 #bag-drawer .drawer-content{padding-left:23px;padding-right:23px}
 #bag-drawer .drawer-actions{padding-top:12px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
 #bag-drawer .drawer-actions .bag-fineprint{margin:6px 0 10px}
 #bag-drawer .bag-total>span:first-child{font-size:23px}
 #bag-drawer .bag-featured>img{max-height:185px}
 #bag-drawer.has-many .bag-featured>img{height:125px;max-height:125px;aspect-ratio:auto;margin-bottom:10px}
 #bag-drawer.has-many .bag-featured h3{font-size:27px;margin-bottom:6px}
 #bag-drawer.has-many .bag-featured .bag-item-info{padding-right:25px}
 #bag-drawer.has-many .bag-featured .qty{margin-top:9px}
 #bag-drawer .bag-item .qty{margin-top:10px}
 #bag-drawer .qty button{width:33px;height:33px}
 #bag-drawer .bag-item{padding-top:14px;padding-bottom:14px}
 #bag-drawer .bag-add-more{margin-top:10px;margin-bottom:11px;min-height:32px}
 #bag-drawer .bag-featured .bag-remove{bottom:48px}
 #bag-drawer[data-view='sellado']{inset:0;margin:auto;width:calc(100vw - 46px);height:min(465px,calc(100dvh - 70px))}
 #bag-drawer[data-view='sellado'] .drawer-content{padding-top:150px;padding-bottom:23px}
 #bag-drawer[data-view='sellado'] .bag-fold{height:78px}
 #bag-drawer[data-view='sellado'] .bag-seal{height:100px}
}
@media(max-height:700px) and (max-width:700px){
 #bag-drawer .drawer-head h2{font-size:34px}
 #bag-drawer.has-many .bag-featured>img{height:100px;max-height:100px}
 #bag-drawer .drawer-head{padding-top:19px}
 #bag-drawer .drawer-actions{padding-bottom:21px}
}
@media(max-width:700px){
 #bag-drawer.has-many .bag-item-info{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;padding-right:0}
 #bag-drawer.has-many .bag-item-info h3{grid-column:1;grid-row:1;font-size:25px;margin:0}
 #bag-drawer.has-many .bag-item-info .qty{grid-column:2;grid-row:1;margin:0;gap:5px}
 #bag-drawer.has-many .bag-item-info .qty button{width:29px;height:31px}
 #bag-drawer.has-many .bag-item-info p{grid-column:1/-1;grid-row:2;margin-top:8px;padding-right:15px}
 #bag-drawer.has-many .bag-item{padding-right:0}
 #bag-drawer.has-many .bag-item .bag-remove{top:auto;bottom:8px;right:-13px;width:32px;height:36px}
 #bag-drawer.has-many .bag-featured .bag-remove{bottom:11px}
}

/* Equal product presentation, without a privileged first item. */
#bag-drawer .bag-item.bag-featured{display:block;padding:10px 0 19px}
#bag-drawer .bag-item.bag-featured>img{width:100%;height:170px;max-height:170px;aspect-ratio:auto;margin:0 0 13px;object-fit:cover}
#bag-drawer .bag-item.bag-featured .bag-item-info{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:0}
#bag-drawer .bag-item.bag-featured h3{grid-row:1;grid-column:1;font-size:29px;margin:0}
#bag-drawer .bag-item.bag-featured .qty{grid-row:1;grid-column:2;margin:0;gap:6px}
#bag-drawer .bag-item.bag-featured p{grid-row:2;grid-column:1/-1;padding-right:22px;margin:0;font-size:12px;line-height:1.5}
#bag-drawer .bag-item.bag-featured .bag-remove{top:auto;bottom:11px;right:-11px}
#bag-drawer .bag-item.bag-featured .qty button{width:31px;height:33px}
/* Closed package: folded top, horizontal seal, shorter body. */
#bag-drawer[data-view='sellado']{inset:0;margin:auto;width:min(320px,calc(100vw - 54px));height:min(390px,calc(100dvh - 80px))}
#bag-drawer[data-view='sellado'] .bag-surface{clip-path:polygon(5% 0,95% 0,100% 95%,95% 100%,5% 100%,0 95%)}
#bag-drawer[data-view='sellado'] .bag-fold{top:12px;left:14px;right:14px;height:58px;background:#b53d24;clip-path:polygon(0 0,100% 0,95% 100%,5% 100%)}
#bag-drawer[data-view='sellado'] .bag-seal{left:calc(50% - 54px);top:49px;width:108px;height:42px;background:#fff2d8;transform:none}
#bag-drawer[data-view='sellado'] .seal-wordmark{width:77px;height:30px;transform:none}
#bag-drawer[data-view='sellado'] .bag-gusset{display:none}
#bag-drawer[data-view='sellado'] .bag-bottom-fold{height:23px;bottom:12px}
#bag-drawer[data-view='sellado'] .drawer-head{padding:12px 16px}
#bag-drawer[data-view='sellado'] .drawer-close{height:36px;width:36px}
#bag-drawer[data-view='sellado'] .drawer-content{padding:116px 23px 25px;align-items:flex-start;overflow-y:auto}
#bag-drawer[data-view='sellado'] .packed-message h3{font-size:30px;line-height:1.05;letter-spacing:-.7px;margin:0 0 14px}
#bag-drawer[data-view='sellado'] .packed-message>p{font-size:12px;line-height:1.5;margin:9px 0 14px}
#bag-drawer[data-view='sellado'] .packed-message>.button{font-size:13px;min-height:44px;padding:12px 19px;margin:1px 0 8px}
#bag-drawer[data-view='sellado'] .packed-message>.text-link{font-size:12px;min-height:35px;margin:0 auto 4px}
#bag-drawer[data-view='sellado'] .packed-message>.bag-fineprint{font-size:10px;max-width:200px;line-height:1.5;margin:5px auto 0}
@media(max-width:700px){
 #bag-drawer .bag-item.bag-featured>img{height:130px;max-height:130px;margin-bottom:10px}
 #bag-drawer .bag-item.bag-featured{padding:10px 0 17px}
 #bag-drawer .bag-item.bag-featured h3{font-size:26px}
 #bag-drawer .bag-item.bag-featured .qty{gap:5px}
 #bag-drawer .bag-item.bag-featured .qty button{width:29px;height:31px}
 #bag-drawer .bag-item.bag-featured .bag-remove{bottom:9px}
 #bag-drawer .bag-item.bag-featured p{font-size:12px}
 #bag-drawer[data-view='sellado']{width:min(320px,calc(100vw - 54px));height:min(390px,calc(100dvh - 80px))}
}
@media(max-width:700px) and (max-height:700px){#bag-drawer .bag-item.bag-featured>img{height:110px;max-height:110px}}

/* Closing uses the same compact silhouette throughout; only the flap and seal move. */
#bag-drawer[data-view='sellado'] .bag-fold,#bag-drawer[data-view='sellado'] .bag-seal{transition:none}
#bag-drawer[data-view='sellado'].is-packing .bag-fold{animation:bag-flap-close .5s ease-out both}
#bag-drawer[data-view='sellado'].is-packing .bag-seal{animation:bag-seal-press .25s .35s ease-out both}
@keyframes bag-flap-close{from{transform:rotateX(-75deg)}to{transform:rotateX(0)}}
@keyframes bag-seal-press{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#bag-drawer[data-view='sellado'].is-packing .bag-fold,#bag-drawer[data-view='sellado'].is-packing .bag-seal{animation:none}}

/* Galaza's clay character accompanies each task. */
.mascot{display:block;object-fit:contain;filter:none;box-shadow:none;pointer-events:none;max-width:100%}
#bag-drawer[data-view='sellado']{width:min(350px,calc(100vw - 40px));height:min(555px,calc(100dvh - 40px))}
#bag-drawer[data-view='sellado'] .drawer-content{padding:90px 24px 24px}
#bag-drawer[data-view='sellado'] .packed-message{width:100%}
#bag-drawer[data-view='sellado'] .packed-rider{width:260px;height:175px;margin:0 auto 8px}
#bag-drawer[data-view='sellado'] .packed-message h3{font-size:29px;margin:0 0 10px}
#bag-drawer[data-view='sellado'] .packed-message>p{margin:7px 0 12px}
#bag-drawer[data-view='sellado'] .bag-fold{height:46px}
#bag-drawer[data-view='sellado'] .bag-seal{top:36px;height:37px}
@media(max-height:620px){#bag-drawer[data-view='sellado'] .drawer-content{padding-top:78px}#bag-drawer[data-view='sellado'] .packed-rider{height:115px;width:200px}#bag-drawer[data-view='sellado'] .packed-message h3{font-size:25px}}
@media(prefers-reduced-motion:no-preference){#bag-drawer[data-view='sellado'] .packed-rider{animation:rider-arrive .5s ease-out both}@keyframes rider-arrive{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:translateX(0)}}}

/* Characters have a composed brand scene rather than shrinking the page titles. */
.character-scene{display:flex;align-items:center;justify-content:center;gap:35px;background:var(--orange);color:var(--paper);overflow:hidden}
.character-scene-copy>span{display:block;font:24px/1.2 Hand,cursive;margin-bottom:12px}
.character-scene-copy h2{font-size:52px;line-height:1;letter-spacing:-1.3px}
.character-scene-copy p{font:38px/1.05 Editorial,Georgia,serif;letter-spacing:-.8px}
.character-scene .text-link{display:inline-block;color:var(--paper);font-size:14px;margin-top:20px;border-bottom:1px solid currentColor}
.welcome-scene{padding:28px 35px;min-height:260px;border:0}
.welcome-scene .scene-mascot{width:330px;height:225px;flex-shrink:0}
.catalog-search{width:360px;max-width:100%;margin-top:22px}.catalog-search>label{display:block;margin-top:22px}
.menu-scene{gap:10px;min-height:180px;padding:12px 15px}
.menu-scene .scene-mascot{width:160px;height:160px;flex-shrink:0}
.menu-scene .character-scene-copy>span{font-size:20px;margin-bottom:8px}.menu-scene .character-scene-copy p{font-size:30px}
.fresh-strip{padding-right:max(30px,calc((100vw - 1150px)/2));min-height:0}.fresh-strip>div{display:flex}
@media(max-width:700px){
 .welcome-scene{gap:0;min-height:215px;padding:26px 20px;justify-content:space-between}
 .welcome-scene .character-scene-copy{flex:1;min-width:0;z-index:1}
 .welcome-scene .character-scene-copy>span{font-size:23px;margin-bottom:12px}
 .welcome-scene .character-scene-copy h2{font-size:35px;letter-spacing:-.8px}
 .welcome-scene .text-link{font-size:12px;margin-top:15px}
 .welcome-scene .scene-mascot{width:190px;height:170px;flex-shrink:0;margin-right:-10px}
 .catalog-search{width:100%}.menu-scene{min-height:175px;padding:8px 18px;justify-content:space-between;gap:15px}
 .menu-scene .scene-mascot{width:160px;height:165px}.menu-scene .character-scene-copy{flex:1}.menu-scene .character-scene-copy p{font-size:32px}
 .fresh-strip{padding:34px 22px 38px;min-height:0}.fresh-strip>p{font-size:35px}.fresh-strip>div{margin:27px 0 12px;flex-direction:row;flex-wrap:wrap;gap:5px 12px}.fresh-strip>div>span{margin:0}.fresh-strip .text-link{white-space:nowrap}
}
@media(max-width:360px){.welcome-scene .scene-mascot{width:160px}.welcome-scene .character-scene-copy h2{font-size:30px}.menu-scene .scene-mascot{width:135px}.menu-scene .character-scene-copy p{font-size:29px}}