/* 按用户参考标头的 640 px 基准坐标等比缩放，游戏名置于五星上方留白。 */
.reference-masthead {
  container-type: inline-size;
  margin: -30px -32px 18px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
}
.reference-header { position: relative; height: 41.5625cqw; }
.reference-icon { position: absolute; left: 2.03125cqw; top: 3.4375cqw; width: 15cqw; height: 15cqw; overflow: hidden; border-radius: 1.875cqw; box-shadow: 0 .625cqw 1.875cqw #a1796220; outline: .15625cqw solid #eadbcd; }
.reference-icon .game-icon-image, .dock-icon .game-icon-image { width: 100%; height: 100%; object-fit: contain; transform: none; }
.reference-stats { position: absolute; left: 18.75cqw; top: 9.6875cqw; }
.reference-game-name { position: absolute; left: 18.75cqw; top: 3.4375cqw; margin: 0; color: var(--ink); font-family: var(--sans); font-size: 4.0625cqw; line-height: 1.25; font-weight: 700; letter-spacing: .3125cqw; white-space: nowrap; }
.reference-rating { display: flex; align-items: baseline; gap: .625cqw; height: 5.3125cqw; white-space: nowrap; }
.reference-stars { font-size: 4.375cqw; color: #d9a752; line-height: 1; letter-spacing: -.3125cqw; }
.reference-rating #rating-count { font-size: 3.125cqw; color: var(--muted); }
.reference-meta { display: flex; align-items: baseline; gap: 2.5cqw; font-size: 3.75cqw; line-height: 1.15; white-space: nowrap; color: var(--muted); }
.reference-score { position: absolute; right: 4.6875cqw; top: 3.28125cqw; text-align: left; }
.reference-score > span { display: block; color: var(--muted); font-size: 4.0625cqw; line-height: 1.45; }
.reference-score strong { display: block; color: var(--rose); font-size: 6.25cqw; font-weight: 400; line-height: 1.15; letter-spacing: -.15625cqw; }
.reference-assurances { position: absolute; left: 0; right: 0; top: 26.5625cqw; display: flex; justify-content: center; align-items: center; gap: 5.3125cqw; color: #72765d; font-size: 3.125cqw; line-height: 1.2; }
.reference-assurances > span { display: flex; align-items: center; gap: .78125cqw; white-space: nowrap; }
.reference-assurances img { width: 3.4375cqw; height: 3.4375cqw; }
.reference-review-heading { position: absolute; left: 0; right: 0; top: 34.6875cqw; height: 5cqw; }
.reference-review-heading h2 { position: absolute; z-index: 1; left: 30.625cqw; width: 38.75cqw; top: 0; height: 5cqw; box-sizing: border-box; border: .15625cqw solid #c7ae94; margin: 0; background: var(--surface); color: #624b3b; font-family: var(--serif); font-size: 5cqw; line-height: 4.6875cqw; font-weight: 700; letter-spacing: .78125cqw; text-align: center; padding-left: .78125cqw; }
.heading-rule { position: absolute; height: .3125cqw; width: 24cqw; background: linear-gradient(90deg, transparent, #c7ae94); }
.heading-rule-left { left: 12.1875cqw; top: 2.1875cqw; }
.heading-rule-right { right: 12.1875cqw; top: 1.09375cqw; transform: rotate(180deg); }
.heading-rule::after { content: ""; position: absolute; left: 5cqw; right: 0; top: .78125cqw; height: .15625cqw; background: var(--line); }
.heading-squares { position: absolute; width: 1.5625cqw; height: 1.5625cqw; background: #c7ae94; box-shadow: .9375cqw -.9375cqw 0 #e4d7c8; }
.heading-squares-left { left: 27.8125cqw; top: 5.3125cqw; }
.heading-squares-right { right: 27.8125cqw; top: -1.25cqw; }
@media(max-width:600px) { .reference-masthead { margin: -21px -17px 17px; } }
@media(max-width:370px) { .reference-masthead { margin-left: -12px; margin-right: -12px; } }
