.hj-shelf{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3) var(--space-2);padding:var(--space-4) var(--space-2) var(--space-2);border-radius:var(--radius-md);background:var(--color-surface-muted);touch-action:manipulation}.hj-jar{position:relative;padding:0;border:0;background:none;cursor:pointer;display:grid;justify-items:center}.hj-glass{position:relative;width:78%;aspect-ratio:1 / 2.1;display:flex;flex-direction:column-reverse;border:3px solid var(--neutral-50);border-top-width:5px;border-radius:0.5rem 0.5rem 1.2rem 1.2rem;background:rgba(255,255,255,0.6);overflow:hidden;transition:transform 0.15s}.hj-jar.is-up .hj-glass{transform:translateY(-14%);box-shadow:0 8px 8px rgba(0,0,0,0.2);border-color:var(--color-action)}.hj-jar:hover .hj-glass{border-color:var(--neutral-30)}.hj-layer{flex:0 0 25%;display:grid;place-items:center;font:700 clamp(0.9rem,3vw,1.3rem) var(--font-head);color:rgba(0,0,0,0.5);box-shadow:inset 0 2px 0 rgba(255,255,255,0.35)}.hj-jar.is-done .hj-glass{border-color:var(--primary-40)}.hj-jar.is-done::after{content:"\2713";position:absolute;bottom:0.1rem;font-weight:700;color:var(--primary-30)}@media (prefers-reduced-motion:reduce){.hj-glass{transition:none}}