.games{margin-top:calc(1.5 * var(--rhythmic-unit));grid-template-columns:1fr;display:grid}.game{--game-miniature-width:100px;--game-miniature-height:70px;grid-template-columns:subgrid;gap:var(--rhythmic-unit);padding:calc(2 * var(--rhythmic-unit)) 0;border-top:var(--border);grid-column:1/-1;align-items:start;display:grid}.game__card{grid-column:1/-1;grid-template-columns:subgrid;gap:calc(.5 * var(--rhythmic-unit));display:grid}.game__card-miniature{width:100px;max-width:var(--game-miniature-width);height:var(--game-miniature-height);border-radius:var(--border-radius);align-self:flex-start;overflow:hidden;& img{object-fit:cover;border:var(--border);border-radius:var(--border-radius);width:100%;height:100%}}.game__name{font-size:var(--font-size-big);text-wrap-style:pretty;line-height:1.2}.game__year{font-size:var(--font-size-small);color:var(--color-text-secondary);transition:var(--transition-mode) color}.game__materials{gap:var(--rhythmic-unit);margin-top:var(--rhythmic-unit);flex-direction:column;display:flex}.game__material{align-items:center;column-gap:calc(.5 * var(--rhythmic-unit));padding:calc(.5 * var(--rhythmic-unit)) calc(2.5 * var(--rhythmic-unit)) calc(.5 * var(--rhythmic-unit)) calc(.75 * var(--rhythmic-unit));border-radius:var(--border-radius);background:var(--color-surface);border:var(--border-width) solid transparent;transition:var(--transition) background-color, var(--transition) border-color, var(--transition-mode) color;grid-template-columns:max-content 1fr;text-decoration:none;display:grid;position:relative;&,&:visited{color:var(--color-contrast--no-animation)}&:after{content:"→";color:var(--color-text-secondary);top:50%;right:calc(.75 * var(--rhythmic-unit));transition:var(--transition-slow) transform, var(--transition-mode) color;position:absolute;transform:translateY(-50%)}&:hover,&:focus-visible,&:active{background:var(--color-bg);border-color:var(--color-border);&,&:visited{color:var(--color-link--no-animation)}&:after{color:var(--color-link);transform:translateY(-50%)translate(4px)}& .game__material-title{color:var(--color-link)}}}:dir(rtl) .game__material{&:after{right:auto;left:calc(.75 * var(--rhythmic-unit));transform:translateY(-50%)scaleX(-1)}&:hover,&:focus-visible,&:active{&:after{transform:translateY(-50%)scaleX(-1)translate(4px)}}}.game__material-title{font-size:var(--font-size-root);color:var(--color-contrast--no-animation);transition:var(--transition-mode) color;font-weight:500;line-height:1.56}.game__material-description{font-size:var(--font-size-small);color:var(--color-text-secondary);transition:var(--transition-mode) color;grid-column:1/-1}.game__material-icon{align-self:flex-start;margin-top:5px}.game__material--article .game__material-icon{color:var(--color-link);transition:var(--transition-mode) color}@media (width>=320px){.game__card{gap:var(--rhythmic-unit)}.game__materials{margin-top:0}}@media (width>=320px) and (width<700px){.games{grid-template-columns:max-content 1fr}.game__materials{grid-column:1/3}.game__card-header{align-self:center}}@media (width>=700px){.games{grid-template-columns:max-content max-content 1fr}.game__card-header{max-width:180px}.game__materials{align-self:center}}