.cart-backdrop{position:fixed;inset:0;z-index:130;background:rgba(31,8,14,.52);opacity:0;backdrop-filter:blur(5px);transition:opacity .28s ease}.cart-backdrop[hidden],.cart-drawer[hidden]{display:none}.cart-backdrop.is-open{opacity:1}
.cart-drawer{position:fixed;z-index:140;top:0;right:0;width:min(465px,100%);height:100dvh;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;overflow:hidden;border-left:1px solid rgba(118,20,40,.13);background:#fffdf9;color:var(--ink);box-shadow:-30px 0 90px rgba(42,7,14,.22);transform:translateX(105%);transition:transform .32s cubic-bezier(.22,.8,.2,1)}.cart-drawer.is-open{transform:translateX(0)}
.cart-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 22px 15px;border-bottom:1px solid #eee2d9;background:linear-gradient(145deg,#fff,#fff8ef)}.cart-kicker{display:block;margin-bottom:3px;color:var(--red);font-size:11px;font-weight:800}.cart-drawer-head h2{display:flex;align-items:center;gap:9px;margin:0;color:#4f1420;font-size:24px}.cart-drawer-head h2 b{min-width:25px;height:25px;display:grid;place-items:center;padding:0 7px;border-radius:999px;background:var(--gradient);color:#fff;font:800 11px Arial}.cart-drawer-head>button{width:42px;height:42px;display:grid;place-items:center;border:1px solid #e7d9d0;border-radius:50%;background:#fff;color:#6f5f5a;font-size:23px;transition:.2s}.cart-drawer-head>button:hover{border-color:#d8a8b2;background:#fff1f3;color:var(--red);transform:rotate(5deg)}
.cart-added-notice{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:10px;margin:12px 18px 0;padding:10px 12px;border:1px solid #cfe5d6;border-radius:13px;background:#f2fbf5;color:#277447;animation:notice-in .25s ease}.cart-added-notice>.ui-icon{width:24px;height:24px;padding:5px;border-radius:50%;background:#d7f0df}.cart-added-notice span{display:grid;gap:1px}.cart-added-notice b{font-size:12px}.cart-added-notice small{color:#5d8068;font-size:10px}@keyframes notice-in{from{opacity:0;transform:translateY(-6px)}}
.cart-flow{display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:7px;padding:13px 22px;border-bottom:1px solid #f0e6df;background:#fff}.cart-flow span{display:flex;align-items:center;gap:5px;color:#a39892;font-size:9px;font-weight:700;white-space:nowrap}.cart-flow span i{width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#eee8e3;color:#847972;font:800 9px Arial}.cart-flow span.active{color:#8c0b26}.cart-flow span.active i{background:var(--gradient);color:#fff}.cart-flow>b{height:1px;background:#e7dbd3}
.cart-drawer-items{min-height:0;overflow:auto;padding:5px 18px 12px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d7c5b9 transparent}.drawer-line{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:12px;padding:15px 0;border-bottom:1px solid #eee4dc;animation:line-in .24s ease}@keyframes line-in{from{opacity:0;transform:translateX(8px)}}.drawer-line-photo{width:84px;height:92px;overflow:hidden;border:1px solid #ebded5;border-radius:14px;background:#f5eee8}.drawer-line-photo .product-photo{display:block;width:100%;height:100%}.drawer-line-info{min-width:0;display:flex;flex-direction:column;align-items:flex-start;padding:2px 0}.drawer-line-info>a{display:-webkit-box;overflow:hidden;color:#4b2028;font-size:13px;font-weight:800;line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:2}.drawer-line-info small{margin-top:4px;color:#8c7e77;font-size:10px}.drawer-qty{height:31px;display:grid;grid-template-columns:30px 28px 30px;align-items:center;margin-top:auto;overflow:hidden;border:1px solid #e3d5cc;border-radius:999px;background:#fff}.drawer-qty button{height:100%;border:0;background:#fff8f1;color:#8b1730;font:700 15px Arial}.drawer-qty button:hover{background:#f8e5e8}.drawer-qty button:disabled{opacity:.4}.drawer-qty b{text-align:center;font:800 11px Arial}.drawer-line-side{min-width:82px;display:flex;flex-direction:column;align-items:flex-end;padding-top:2px}.drawer-line-side strong{color:#8e0a26;font-size:12px;white-space:nowrap}.drawer-line-side button{margin-top:auto;padding:5px;border:0;background:none;color:#9a777d;font-size:10px;font-weight:700}.drawer-line-side button:hover{color:var(--red);text-decoration:underline}
.cart-loading{display:grid;gap:12px;padding:15px 0}.cart-loading i{height:92px;border-radius:14px;background:linear-gradient(90deg,#f2eae4 25%,#faf6f2 45%,#f2eae4 65%);background-size:200% 100%;animation:cart-shimmer 1.2s linear infinite}@keyframes cart-shimmer{to{background-position:-200% 0}}
.drawer-empty{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:35px 20px;text-align:center}.drawer-empty-icon{width:72px;height:72px;display:grid;place-items:center;margin-bottom:18px;border:1px solid #ead8c9;border-radius:24px;background:linear-gradient(145deg,#fff7e6,#f7e4c0);color:#a5732a;font-size:35px;transform:rotate(-5deg)}.drawer-empty h3{margin:0 0 8px;color:#541a25;font-size:21px}.drawer-empty p{max-width:290px;margin:0;color:#84766f;font-size:13px;line-height:1.8}.drawer-shop-link{margin-top:20px;padding:11px 18px;border-radius:999px;background:var(--gradient);color:#fff;font-size:12px;font-weight:800;box-shadow:0 12px 25px rgba(160,9,40,.17)}
.cart-drawer-foot{padding:16px 20px 18px;border-top:1px solid #e8dcd3;background:linear-gradient(155deg,#fffaf3,#f8eee4);box-shadow:0 -15px 35px rgba(64,20,12,.06)}.cart-drawer-foot[hidden]{display:none}.drawer-pickup{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:9px;margin-bottom:12px;padding:10px 11px;border:1px solid #e8dacd;border-radius:12px;background:rgba(255,255,255,.72);color:#8f1830}.drawer-pickup>.ui-icon{width:20px;height:20px}.drawer-pickup span{display:grid;gap:2px}.drawer-pickup b{color:#4e292f;font-size:11px}.drawer-pickup small{color:#8a7a73;font-size:9px}.drawer-pickup em{padding:5px 7px;border-radius:999px;background:#e5f4e9;color:#2e7548;font-size:9px;font-style:normal;font-weight:800}.drawer-total{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:9px 1px 13px}.drawer-total>span{display:grid;color:#4b2b31;font-size:13px;font-weight:800}.drawer-total small{margin-top:2px;color:#968780;font-size:9px;font-weight:400}.drawer-total strong{color:#8f0a27;font-size:20px}.drawer-checkout{height:53px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:13px;background:linear-gradient(110deg,#870820,#df1c42);color:#fff;font-size:14px;font-weight:900;box-shadow:0 14px 30px rgba(160,9,40,.22);transition:.2s}.drawer-checkout:hover{transform:translateY(-1px);box-shadow:0 17px 36px rgba(160,9,40,.28)}.drawer-checkout .ui-icon{width:18px}.drawer-view-cart{display:block;margin-top:10px;color:#6f5158;text-align:center;font-size:11px;font-weight:700}.drawer-view-cart:hover{color:var(--red)}.cart-drawer-foot>p{display:flex;align-items:center;justify-content:center;gap:6px;margin:11px 0 0;color:#8b7d77;font-size:9px}.cart-drawer-foot>p .ui-icon{width:13px;color:#a4742d}
@media(max-width:600px){.cart-drawer{top:auto;right:0;bottom:0;width:100%;height:min(90dvh,760px);border:0;border-radius:25px 25px 0 0;box-shadow:0 -30px 80px rgba(42,7,14,.25);transform:translateY(105%)}.cart-drawer.is-open{transform:translateY(0)}.cart-drawer:before{content:"";position:absolute;z-index:2;top:7px;right:50%;width:43px;height:4px;border-radius:999px;background:#d8cac1;transform:translateX(50%)}.cart-drawer-head{padding:21px 16px 12px}.cart-drawer-head h2{font-size:21px}.cart-drawer-head>button{width:38px;height:38px}.cart-flow{padding:11px 16px}.cart-flow span{font-size:8px}.cart-drawer-items{padding:3px 14px 10px}.drawer-line{grid-template-columns:74px minmax(0,1fr) auto;gap:10px;padding:12px 0}.drawer-line-photo{width:74px;height:82px;border-radius:12px}.drawer-line-side{min-width:70px}.drawer-line-side strong{font-size:11px}.cart-drawer-foot{padding:13px 14px calc(14px + env(safe-area-inset-bottom))}.drawer-pickup{margin-bottom:9px}.drawer-checkout{height:50px}.cart-added-notice{margin:8px 14px 0}.drawer-empty{min-height:280px}}
@media(prefers-reduced-motion:reduce){.cart-drawer,.cart-backdrop,.drawer-line,.cart-added-notice{transition:none;animation:none}}

/* Editable size and clearer cart hierarchy — v3.0 */
.cart-drawer{width:min(500px,100%)}.cart-added-notice small{display:block;max-width:370px;overflow:hidden;color:#527460;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.drawer-line{grid-template-columns:92px minmax(0,1fr) auto;gap:13px;padding:16px 0}.drawer-line-photo{width:92px;height:104px}.drawer-line-info{justify-content:flex-start}.drawer-line-info>a{font-size:14px;line-height:1.45}.drawer-size-select{width:min(100%,195px);height:36px;display:grid;grid-template-columns:auto minmax(0,1fr) 14px;align-items:center;gap:7px;margin:8px 0;padding:0 9px;border:1px solid #e4d3c5;border-radius:10px;background:linear-gradient(145deg,#fff,#fff7ec);color:#816d64;box-shadow:inset 0 1px #fff;transition:border-color .2s,box-shadow .2s}.drawer-size-select>span{font-size:10px;font-weight:800;white-space:nowrap}.drawer-size-select select{width:100%;height:100%;min-width:0;padding:0 3px;border:0;outline:0;appearance:none;background:transparent;color:#7d1329;text-align:center;font-size:12px;font-weight:900;cursor:pointer}.drawer-size-select i{color:#ad7d32;font-style:normal;font-size:12px;pointer-events:none}.drawer-size-select:focus-within{border-color:#c51031;box-shadow:0 0 0 4px rgba(197,16,49,.08)}.drawer-size-select select:disabled{cursor:default;opacity:.72}.drawer-qty{margin-top:0}.drawer-line-side strong{font-size:13px}.drawer-line-side button{font-size:11px}.drawer-size-select select:focus-visible{outline:2px solid #c51031;outline-offset:2px}
@media(max-width:600px){.cart-added-notice small{max-width:calc(100vw - 90px)}.drawer-line{grid-template-columns:76px minmax(0,1fr) auto;gap:9px}.drawer-line-photo{width:76px;height:90px}.drawer-line-info>a{font-size:12px}.drawer-size-select{width:min(100%,160px);height:33px;gap:4px;margin:6px 0;padding:0 7px}.drawer-size-select>span{font-size:9px}.drawer-size-select select{font-size:11px}.drawer-line-side{min-width:64px}.drawer-line-side strong{font-size:10px}.drawer-qty{height:29px;grid-template-columns:27px 25px 27px}}