#tsf-cart-trigger{position:fixed;top:14px;right:14px;z-index:9999;min-width:44px;height:44px;background:#fff;border:1px solid #d6dde6;border-radius:22px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.06);transition:transform .15s ease,background .15s ease,padding .15s ease;padding:0 12px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
#tsf-cart-trigger:hover{transform:scale(1.04)}
#tsf-cart-trigger.tsf-has-items{background:#D4A574;border-color:#D4A574;color:#fff;padding:0 14px;gap:6px}
#tsf-cart-trigger #tsf-cart-count{font-size:14px;font-weight:600;color:#fff}
#tsf-cart-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:9998;opacity:0;pointer-events:none;transition:opacity .2s ease}
#tsf-cart-backdrop.tsf-open{opacity:1;pointer-events:auto}
#tsf-cart-drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:92vw;background:#fff;z-index:10000;transform:translateX(100%);transition:transform .25s cubic-bezier(.2,.7,.3,1);display:flex;flex-direction:column;box-shadow:-4px 0 20px rgba(0,0,0,.1);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
#tsf-cart-drawer.tsf-open{transform:translateX(0)}
.tsf-drawer-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #f0f0f0}
.tsf-drawer-title{font-size:20px;font-weight:600;color:#1a1a1a;letter-spacing:-.01em}
.tsf-drawer-close{background:none;border:none;cursor:pointer;padding:8px;color:#666;display:flex;align-items:center}
.tsf-drawer-close:hover{color:#1a1a1a}
.tsf-cart-body{flex:1;overflow-y:auto;padding:8px 24px}
.tsf-empty{text-align:center;color:#888;padding:60px 20px;font-size:15px}
.tsf-empty-cta{display:inline-block;margin-top:20px;background:#D4A574;color:#fff;padding:12px 28px;border-radius:28px;text-decoration:none;font-weight:600;font-size:15px}
.tsf-empty-cta:hover{background:#C49464}
.tsf-cart-item{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid #f0f0f0;align-items:flex-start}
.tsf-cart-item:last-child{border-bottom:none}

/* Thumbnail wrap. Width/height are set inline in JS based on orientation
   (portrait 90×110, landscape 110×90). The image itself is the server-side
   composite from /api/cart-thumbnail — frame chrome, mat, and card all baked
   into one PNG at the correct geometry. object-fit:contain keeps the full
   composite visible inside the box.
   Background shimmer animation runs while the image loads, then is masked
   by the rendered image on top. Once preloaded (preloadCartThumbnails on
   mount), most users will never see the shimmer. */
.tsf-thumb-wrap{flex-shrink:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:4px;background:linear-gradient(90deg,#f0f0f0 0%,#f8f8f8 50%,#f0f0f0 100%);background-size:200% 100%;animation:tsfShimmer 1.4s ease-in-out infinite}
.tsf-item-thumb{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;opacity:0;transition:opacity .2s ease}
.tsf-item-thumb.tsf-loaded{opacity:1}
.tsf-thumb-wrap.tsf-loaded{background:none;animation:none}
.tsf-thumb-empty{width:100%;height:100%;background:#f5f5f5;border-radius:4px}
@keyframes tsfShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

.tsf-item-meta{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.tsf-item-name{font-size:15px;font-weight:600;color:#1a1a1a;line-height:1.3}
.tsf-item-config{font-size:13px;color:#666;line-height:1.3}
.tsf-item-price{font-size:15px;font-weight:600;color:#1a1a1a;margin-top:auto;padding-top:4px}
.tsf-item-actions{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.tsf-qty{display:inline-flex;align-items:center;border:1px solid #d6dde6;border-radius:6px;overflow:hidden}
.tsf-qty button{background:none;border:none;cursor:pointer;width:28px;height:28px;color:#1a1a1a;font-size:16px;line-height:1;padding:0}
.tsf-qty button:hover{background:#f5f5f5}
.tsf-qty span{font-size:14px;font-weight:600;min-width:24px;text-align:center;color:#1a1a1a}
.tsf-edit{background:none;border:none;color:#666;cursor:pointer;font-size:13px;text-decoration:underline;padding:4px;font-family:inherit}
.tsf-edit:hover{color:#1a1a1a}
.tsf-remove{background:none;border:none;color:#999;cursor:pointer;font-size:13px;text-decoration:underline;padding:4px;font-family:inherit}
.tsf-remove:hover{color:#1a1a1a}
.tsf-drawer-footer{border-top:1px solid #f0f0f0;padding:20px 24px;background:#fff}
.tsf-shipping-note{font-size:13px;color:#666;text-align:center;margin-bottom:12px}
.tsf-subtotal{display:flex;justify-content:space-between;margin-bottom:16px;font-size:17px;font-weight:600;color:#1a1a1a}
.tsf-checkout-btn{display:block;width:100%;background:#D4A574;color:#fff;border:none;padding:16px;border-radius:28px;font-size:16px;font-weight:600;cursor:pointer;text-align:center;text-decoration:none;box-sizing:border-box}
.tsf-checkout-btn:hover{background:#C49464}
@media (max-width:480px){#tsf-cart-drawer{width:100vw;max-width:100vw}.tsf-drawer-header,.tsf-cart-body,.tsf-drawer-footer{padding-left:18px;padding-right:18px}}
