.shop-panel{display:flex;flex-direction:column;height:100%;background:var(--bg-surface-raised);overflow:hidden}.shop-panel__hero{position:relative;width:100%;height:180px;flex-shrink:0;overflow:hidden;background:var(--bg-muted);animation:cf-fade-in var(--dur-slow) var(--ease-out-expo) both}.shop-panel__hero-img{width:100%;height:100%;object-fit:cover;display:block}.shop-panel__hero-placeholder{width:100%;height:100%;background:linear-gradient(135deg,color-mix(in srgb,var(--accent-subtle) 60%,transparent),var(--bg-muted));display:flex;align-items:center;justify-content:center;color:color-mix(in srgb,var(--fg-muted) 40%,transparent)}.shop-panel__hero-gradient{position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(0deg,rgba(43,29,20,.65),transparent);pointer-events:none}.shop-panel__name{position:absolute;bottom:var(--space-4);left:var(--space-4);right:var(--space-4);font-family:var(--font-display),ui-serif,Georgia,serif;font-size:var(--font-size-xl);font-weight:var(--weight-medium);color:var(--bg-surface-raised);margin:0;letter-spacing:var(--tracking-tight);line-height:var(--leading-display);animation:cf-fade-in var(--dur-slow) var(--ease-out-expo) 80ms both}.shop-panel__back{position:absolute;top:var(--space-3);left:var(--space-3);width:40px;height:40px;border-radius:50%;background:var(--bg-surface-raised);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--fg-primary);box-shadow:var(--shadow-2);z-index:2;transition:background var(--dur-fast) var(--ease-out-quart),box-shadow var(--dur-base) var(--ease-out-quart),transform var(--dur-fast) var(--ease-out-quart)}.shop-panel__back:hover{background:var(--bg-surface);box-shadow:var(--shadow-3);transform:translateY(-1px)}.shop-panel__back:active{transform:translateY(0);box-shadow:var(--shadow-1);transition-duration:var(--dur-fast)}.shop-panel__back:focus-visible{outline:none;box-shadow:var(--shadow-focus)}.shop-panel__body{flex:1 1;padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--bg-muted) transparent;animation:cf-fade-in var(--dur-slow) var(--ease-out-expo) .16s both}.shop-panel__body::-webkit-scrollbar{width:4px}.shop-panel__body::-webkit-scrollbar-track{background:transparent}.shop-panel__body::-webkit-scrollbar-thumb{background:var(--bg-muted);border-radius:var(--radius-pill)}.shop-panel__meta{display:flex;flex-direction:column;gap:var(--space-2)}.shop-panel__meta-item{display:flex;align-items:center;gap:var(--space-1);font-family:var(--font-sans),ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-xs);color:var(--fg-secondary)}.shop-panel__pills{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2)}.shop-panel__pill{display:flex;align-items:center;gap:4px;font-family:var(--font-sans);font-size:var(--font-size-xs);color:var(--fg-secondary);background:var(--bg-surface);border:1px solid var(--bg-muted);border-radius:var(--radius-pill);padding:4px var(--space-3)}.shop-panel__pill-count{color:var(--fg-muted)}.shop-panel__pill--open{color:var(--semantic-success);background:color-mix(in srgb,var(--semantic-success) 10%,transparent);border-color:color-mix(in srgb,var(--semantic-success) 25%,transparent)}.shop-panel__open-dot{width:6px;height:6px;border-radius:50%;background:var(--semantic-success);flex-shrink:0}.shop-panel__description{font-family:var(--font-sans),ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-sm);color:var(--fg-secondary);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:var(--leading-snug)}.shop-panel__plans{display:flex;flex-direction:column;gap:var(--space-4);padding-top:var(--space-2)}.shop-panel__plans-title{font-family:var(--font-display),ui-serif,Georgia,serif;font-size:var(--font-size-md);font-weight:var(--weight-medium);color:var(--fg-primary);margin:0;letter-spacing:var(--tracking-tight);line-height:var(--leading-display);animation:cf-fade-in var(--dur-slow) var(--ease-out-expo) .24s both}.shop-panel__payments-note{margin:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--bg-muted);color:var(--fg-secondary);font-family:var(--font-sans),ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-sm);line-height:var(--leading-snug)}.shop-panel__plans-list{display:flex;flex-direction:column;gap:var(--space-3)}.shop-panel__plans-list>:first-child{animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .24s both}.shop-panel__plans-list>:nth-child(2){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .3s both}.shop-panel__plans-list>:nth-child(3){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .36s both}.shop-panel__details-link{background:none;border:none;padding:0;padding-top:var(--space-3);font-family:var(--font-sans),ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-xs);color:var(--fg-muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer;align-self:flex-start;transition:color var(--dur-fast) var(--ease-out-quart),text-underline-offset var(--dur-fast) var(--ease-out-quart)}.shop-panel__details-link:hover{color:var(--fg-primary);text-underline-offset:4px}.shop-panel__details-link:focus-visible{outline:none;border-radius:2px;box-shadow:var(--shadow-focus)}.floating-panel{position:absolute;top:calc(56px + var(--space-5));left:var(--space-5);bottom:var(--space-5);width:420px;background:color-mix(in srgb,var(--bg-surface) 92%,var(--bg-canvas));border-radius:var(--radius-xl);display:flex;flex-direction:column;overflow:hidden;z-index:20;transition:width var(--dur-slow) var(--ease-out-expo),border-radius var(--dur-base) var(--ease-out-quart),box-shadow var(--dur-base) var(--ease-out-quart)}.floating-panel,.floating-panel--expanded{box-shadow:var(--shadow-inset-border),var(--shadow-4)}.floating-panel--expanded{top:56px;left:0;bottom:0;width:80vw;max-width:calc(100vw - 160px);border-radius:0 var(--radius-xl) var(--radius-xl) 0}.floating-panel__list{display:flex;flex-direction:column;height:100%;overflow:hidden}.floating-panel__list-header{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5) 0 var(--space-4);box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--bg-muted) 72%,transparent);flex-shrink:0}.floating-panel__count-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:0 var(--space-5)}.floating-panel__count-cluster{min-width:0;display:flex;align-items:center;gap:var(--space-2)}.floating-panel__cup{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;perspective:420px;transform:translateY(var(--float-y)) rotateX(6deg) rotate(-4deg);animation:floating-panel-cup-levitate 4.8s var(--ease-out-quart) infinite;filter:drop-shadow(0 12px 18px color-mix(in srgb,var(--fg-primary) 16%,transparent))}.floating-panel__cup-shell,.floating-panel__empty-cup-shell{display:inline-grid}.floating-panel__cup-image{width:100%;height:100%;object-fit:contain}.floating-panel__count{font-family:var(--font-sans);font-size:var(--font-size-sm);font-weight:600;color:var(--fg-primary)}.floating-panel__toggle{flex:0 0 auto;border:none;border-radius:var(--radius-pill);padding:var(--space-2) var(--space-3);background:var(--map-marker-default);color:var(--fg-on-accent);font-family:var(--font-sans);font-size:var(--font-size-xs);font-weight:var(--weight-bold);box-shadow:var(--shadow-2);cursor:pointer;transition:transform var(--dur-fast) var(--ease-out-quart),box-shadow var(--dur-fast) var(--ease-out-quart),background var(--dur-fast) var(--ease-out-quart)}.floating-panel__toggle:hover{transform:translateY(-1px);background:var(--map-marker-selected);box-shadow:var(--shadow-3)}.floating-panel__toggle:focus-visible{outline:none;box-shadow:var(--shadow-focus),var(--shadow-2)}.floating-panel__sort{font-family:var(--font-sans),ui-sans-serif,system-ui,sans-serif;font-size:var(--font-size-xs);color:var(--fg-secondary);cursor:pointer;transition:color var(--dur-fast) var(--ease-out-quart)}.floating-panel__sort:hover{color:var(--fg-primary)}.floating-panel__list-scroll{flex:1 1;overflow-y:auto;padding:var(--space-4) var(--space-5) var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);scrollbar-width:thin;scrollbar-color:var(--bg-muted) transparent}.floating-panel--expanded .floating-panel__list-scroll{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));align-content:start;grid-gap:var(--space-4);gap:var(--space-4);padding:var(--space-5);min-width:0}.floating-panel__card-anchor{min-width:0;scroll-margin:var(--space-4)}.floating-panel__list-scroll>:first-child{animation:cf-stagger var(--dur-slow) var(--ease-out-expo) both}.floating-panel__list-scroll>:nth-child(2){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) 40ms both}.floating-panel__list-scroll>:nth-child(3){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) 80ms both}.floating-panel__list-scroll>:nth-child(4){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .12s both}.floating-panel__list-scroll>:nth-child(5){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .16s both}.floating-panel__list-scroll>:nth-child(6),.floating-panel__list-scroll>:nth-child(n+7){animation:cf-stagger var(--dur-slow) var(--ease-out-expo) .2s both}.floating-panel__list-scroll::-webkit-scrollbar{width:4px}.floating-panel__list-scroll::-webkit-scrollbar-track{background:transparent}.floating-panel__list-scroll::-webkit-scrollbar-thumb{background:var(--bg-muted);border-radius:var(--radius-pill)}.floating-panel__sort{display:none}.floating-panel__empty{font-family:var(--font-sans);font-size:var(--font-size-sm);color:var(--fg-muted);text-align:center;display:grid;justify-items:center;grid-gap:var(--space-3);gap:var(--space-3);padding:var(--space-6) var(--space-4);margin:0}.floating-panel__empty p{margin:0}.floating-panel__empty-cup{width:56px;height:56px;display:grid;place-items:center;perspective:420px;transform:translateY(var(--float-y)) rotateX(5deg) rotate(5deg);animation:floating-panel-cup-levitate 5.2s var(--ease-out-quart) infinite reverse;filter:drop-shadow(0 12px 18px color-mix(in srgb,var(--fg-primary) 14%,transparent))}.floating-panel__empty-cup-image{width:100%;height:100%;object-fit:contain}@keyframes floating-panel-cup-levitate{0%,to{translate:0 0}50%{translate:0 -5px}}@media (prefers-reduced-motion:reduce){.floating-panel__list-scroll>*{animation:none!important}.floating-panel,.floating-panel__cup,.floating-panel__empty-cup,.floating-panel__toggle{animation:none;transition:none}.floating-panel__toggle:hover{transform:none}}