.tile{border:1px solid var(--color-line);border-radius:var(--radius-card);background:var(--color-surface);flex-direction:column;height:100%;transition:border-color .2s,box-shadow .25s;display:flex;position:relative;overflow:hidden}.tile:hover{border-color:color-mix(in srgb, var(--color-brand-yellow) 45%, transparent);box-shadow:var(--shadow-lift)}@media (prefers-reduced-motion:no-preference){.tile{transition:border-color .2s, box-shadow .25s, transform .3s var(--ease-out-soft)}.tile:active{transform:scale(.98)}@media (hover:hover){.tile:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-4px)}.tile:hover:active{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-2px) scale(.98)}}}.tile-media{background:radial-gradient(120% 90% at 50% 0%, var(--color-subtle), var(--color-photo) 70%);height:150px;position:relative}.tile-media:before{content:"";background:radial-gradient(closest-side, color-mix(in srgb, var(--color-brand-yellow) 16%, transparent), transparent);opacity:.75;pointer-events:none;border-radius:50%;position:absolute;inset:8% 10%}.tile:hover .tile-media:before{opacity:1}.tile-media>.photo-pop{width:100%;height:100%;transition:transform .4s var(--ease-out-soft);position:relative}.tile-media>.photo-pop>img{object-fit:contain;width:100%;height:100%;padding:12px;position:relative}.tile-media>.photo-pop:before{content:"";opacity:.22;background:url(/brand/logo-dark-bg-144.jpg) 50%/cover;border-radius:14px;width:56px;height:56px;margin:auto;position:absolute;inset:0}.tile-media>.photo-pop:has(>img[data-photo-loaded]):before{content:none}@media (prefers-reduced-motion:no-preference){.tile-media>.photo-pop:before{animation:1.4s ease-in-out infinite alternate tile-photo-wait}}@keyframes tile-photo-wait{to{opacity:.4}}@media (prefers-reduced-motion:no-preference){.tile-media:before{transition:opacity .3s}.tile:hover .tile-media>.photo-pop{transform:scale(1.04)}}.tile-media>.cardart{padding:8px 0}.tile-out .tile-media>*{filter:grayscale()}.tile-out .tile-media:after{content:"";background:color-mix(in srgb, var(--color-photo) 55%, transparent);position:absolute;inset:0}.tile-tag,.tile-sold{z-index:1;pointer-events:none;padding:4px 8px;font-size:12px;line-height:16px;position:absolute;top:8px}.tile-tag{border:1px solid var(--color-line);background:var(--color-surface);color:var(--color-ink);border-radius:6px;font-weight:600;left:8px}.tile-sold{background:var(--color-strong);color:var(--color-on-strong);border-radius:999px;font-weight:700;right:8px}.tile-body{flex-direction:column;flex:1;gap:6px;padding:12px;display:flex}.tile-name{-webkit-line-clamp:2;color:var(--color-ink);-webkit-box-orient:vertical;font-size:13px;font-weight:600;line-height:1.35;text-decoration:none;display:-webkit-box;overflow:hidden}.tile-name:after{content:"";position:absolute;inset:0}.tile-name:hover{text-decoration:underline}.tile-detail{-webkit-line-clamp:2;color:var(--color-ink-2);-webkit-box-orient:vertical;font-size:12px;display:-webkit-box;overflow:hidden}.tile-row{color:var(--color-ink-2);flex-wrap:wrap;justify-content:space-between;align-items:baseline;column-gap:8px;margin-top:auto;padding-top:4px;font-size:12px;display:flex}.tile-price{font-family:var(--font-display);color:var(--color-ink);font-size:15px;font-weight:700}.tile-low{z-index:1;border:1px solid color-mix(in srgb, var(--color-warning) 45%, transparent);background:var(--color-surface);pointer-events:none;color:var(--color-warning);border-radius:6px;padding:2px 6px;font-size:10.5px;font-weight:600;line-height:16px;position:absolute;bottom:6px;left:6px}.tile-actions{z-index:1;gap:6px;margin-top:4px;display:grid;position:relative}.tile-actions:has(>.tile-stepper)>form{display:none}.tile-btn{border:1px solid var(--color-line-strong);border-radius:var(--radius-control);background:var(--color-surface);width:100%;min-height:44px;color:var(--color-ink);cursor:pointer;justify-content:center;align-items:center;padding:0 8px;font-size:14px;font-weight:600;transition:background-color .15s,border-color .15s,box-shadow .2s,transform .15s;display:inline-flex}.tile-btn:hover{border-color:var(--color-ink-3);background:var(--color-subtle)}.tile-btn-main{border-color:var(--color-strong);background:var(--color-strong);color:var(--color-on-strong)}.tile-btn-main:hover{border-color:var(--color-strong-hover);background:var(--color-strong-hover);box-shadow:0 6px 18px -8px var(--color-brand-yellow)}.tile-btn:disabled{cursor:not-allowed;background:var(--color-canvas);color:var(--color-ink-2);opacity:.5}.tile-stepper{border-radius:var(--radius-control);background:var(--color-brand-yellow-tint);min-height:44px;box-shadow:inset 0 0 0 1px var(--color-strong);align-items:center;display:flex}.tile-step{border-radius:var(--radius-control);width:44px;height:44px;color:var(--color-ink);cursor:pointer;background:0 0;flex:none;justify-content:center;align-items:center;font-size:22px;font-weight:600;line-height:1;transition:background-color .15s;display:inline-flex}.tile-step:hover:not([aria-disabled]){background:var(--color-brand-yellow-soft)}.tile-step[aria-disabled]{cursor:not-allowed;opacity:.4}.tile-step-icon{width:20px;height:20px}.tile-qty{text-align:center;min-width:0;font-family:var(--font-display);font-variant-numeric:tabular-nums;color:var(--color-ink);flex:1;font-size:16px;font-weight:700}.tile-error{color:var(--color-danger);font-size:12px;font-weight:600}@media (prefers-reduced-motion:no-preference){.tile-btn:active:not(:disabled),.tile-step:active:not([aria-disabled]){transform:scale(.94)}.tile-step{transition:background-color .15s,transform .15s}.tile-stepper{animation:tile-stepper-in .2s var(--ease-out-soft)}}@keyframes tile-stepper-in{0%{opacity:0;transform:scale(.94)}}@media (min-width:40rem){.tile-media{height:200px}.tile-tag{top:12px;left:12px}.tile-sold{top:12px;right:12px}.tile-low{font-size:11px;inset:8px 8px auto auto}.tile-body{gap:8px;padding:14px 16px 16px}.tile-name{font-size:15px}.tile-detail,.tile-row{font-size:13px}.tile-price{font-size:22px}}
.tile-grid-scope{container:tile-grid/inline-size}.tile-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.tile-grid>li{min-width:0}.tile-grid-2rows>li:nth-child(n+7){display:none}.tile-grid .tile-media{height:112px}.tile-grid .tile-media>.photo-pop>img{padding:8px}.tile-grid .tile-tag{padding:2px 6px;font-size:10.5px;top:6px;left:6px}.tile-grid .tile-sold{padding:2px 6px;font-size:10.5px;top:6px;right:6px}.tile-grid .tile-low{font-size:10.5px;inset:auto auto 6px 6px}.tile-grid .tile-body{gap:3px;padding:7px 7px 8px}.tile-grid .tile-name{min-height:2.5em;font-size:12.5px;line-height:1.25}.tile-grid .tile-detail{display:none}.tile-grid .tile-row{flex-wrap:nowrap;align-items:center;padding-top:2px}.tile-grid .tile-price{font-size:15px}.tile-grid .tile-btn{padding:0 4px;font-size:13px}@container tile-grid (min-width:640px){.tile-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.tile-grid-2rows>li:nth-child(n+7){display:block}.tile-grid-2rows>li:nth-child(n+9){display:none}.tile-grid .tile-media{height:120px}.tile-grid .tile-tag,.tile-grid .tile-sold{font-size:11px;top:8px}.tile-grid .tile-tag{left:8px}.tile-grid .tile-sold{right:8px}.tile-grid .tile-low{font-size:11px;inset:8px 8px auto auto}.tile-grid .tile-body{gap:4px;padding:10px 12px 12px}.tile-grid .tile-name{font-size:14px;line-height:1.3}.tile-grid .tile-row{flex-wrap:wrap;align-items:baseline;font-size:12px}.tile-grid .tile-price{font-size:18px}.tile-grid .tile-btn{font-size:14px}}@container tile-grid (min-width:960px){.tile-grid{gap:20px}.tile-grid .tile-media{height:140px}.tile-grid .tile-body{padding:12px 14px 14px}.tile-grid .tile-name{font-size:15px}.tile-grid .tile-price{font-size:20px}}@container tile-grid (min-width:1150px){.tile-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}.tile-grid-2rows>li:nth-child(n+9){display:block}.tile-grid-2rows>li:nth-child(n+11){display:none}.tile-grid .tile-media{height:130px}}