/* Basket icon tiles. Rules: docs/basket-icons.md. */
/* The night-sky tile is part of each icon, so the image fills the tile. */
.bk-tile{display:inline-grid;place-items:center;flex:none;box-sizing:border-box;border-radius:22%;overflow:hidden;background:#0b1026;box-shadow:0 1px 2px rgba(8,8,30,.12),0 6px 16px rgba(8,8,30,.14);vertical-align:middle}
.bk-tile img{display:block;width:100%;height:100%;transition:transform .24s ease-out}
.bk-tile-48{width:48px;height:48px}
.bk-tile-96{width:96px;height:96px}
.bk-tile-192{width:192px;height:192px}
.basket:hover .bk-tile img,.basket:focus-within .bk-tile img{transform:translateY(-2px)}
.basket-art-icon{position:absolute;inset:0;display:grid;place-items:center}
.basket-art:has(.basket-art-icon){height:140px}
.basket-heading{display:flex;align-items:center;gap:12px;margin:14px 0 10px}.basket-heading h3{margin:0;min-width:0;overflow-wrap:anywhere}
.wallet-entry-name{display:flex;align-items:center;gap:10px;min-width:0}
.basket-form-heading{display:flex;align-items:center;gap:12px}.basket-form-heading h2{margin:0;min-width:0;overflow-wrap:anywhere}
.basket-order-list .bk-tile{cursor:inherit}
@media(prefers-reduced-motion:reduce){.bk-tile img{transition:none}.basket:hover .bk-tile img,.basket:focus-within .bk-tile img{transform:none}}
/* The hero photo box keeps a fixed 3:2 shape before the image loads, so nothing shifts. */
.basket-art>img.basket-photo{aspect-ratio:3/2;object-fit:cover}