/* site-polish.css: loads last. Type consistency and readable picture icons. */

/* Real faces only: Barlow Condensed ships 500-800, so a bold child of a 700 label must not compute to a faked 900. */
b, strong { font-weight: 700; }
.fk-provider b, .doc-tabs b { font-weight: 700; }
.dir-sort select { font-weight: 600; }

/* Small caps labels: nothing under 14px, tracking capped at .16em. */
.kicker, .story-inner .kicker, .page-head-copy .kicker { font-size: 15px; letter-spacing: .16em; }
.toc span { font-size: 15px; letter-spacing: .16em; }
.crumbs a, .crumbs span { font-size: 16px; }
.icon-row-tab { font-size: 17px; }
.legend-info small, .news-body small, .tile-cat { font-size: 14px; }
.tile-by { font-size: 14px; }
.strip-cell small, .stat-strip small { font-size: 14px; letter-spacing: .16em; }
.emblem-core small { font-size: 14px; letter-spacing: .16em; }
.gd-nums dt { font-size: 14px; }
.gd-desc p { font-size: 14px; }
.gd-side { font-size: 14px; letter-spacing: .16em; }
.mini-prices span, .mini-prices em { font-size: 14px; }
.pillar em { font-size: 15px; letter-spacing: .14em; }
.scard-runs small { font-size: 14px; }
.scard-cat, .scard-stat { font-size: 14px; }
.st, .ss-tags .st { font-size: 14px; }
.ah-meta dt, .ss-info dt { font-size: 14px; }
.genre small, .gx-card small, .mcard small { font-size: 14px; }
.icon-row span, .pillars ~ .icon-row span { font-size: 14px; }
.pillars ~ .block .sec-head .more { font-size: 14px; letter-spacing: .14em; }
.gp-step-num { letter-spacing: .16em; }

/* Picture icons: detailed art needs size to read. HOT = 0.93 x ONLINE. */
.inline-wordmark { height: max(2em, 36px); }
.inline-discord { height: max(1.6em, 34px); }
.mark-online { height: 36px; }
.mark-hot { height: 33.5px; }
.pill img.pill-hot { height: 33.5px; }
.gd-dir-bar .pill img { width: 40px; height: 40px; }
.gd-dir-bar .pill img.pill-online { height: 36px; }
.gd-dir-bar .pill img.pill-hot { height: 33.5px; }
.scard-marks .mark-online { height: 36px; }
.scard-marks .mark-hot { height: 33.5px; }
.scard-author img { width: 40px; height: 40px; }
.gd-brand img:first-child { width: 44px; height: 44px; }
.gd-brand img:last-child { height: 32px; }
.gd-globe { width: 64px; height: 64px; }
.icon-row .hud-ico, .pm-steps .hud-ico { width: 80px; height: 80px; }

@media (max-width: 640px) {
  .emblem-core small { font-size: 14px; }
  .genre-label { font-size: 14px; }
  .pillars ~ .icon-row .hud-ico { width: 60px; height: 60px; }
  .pillar span { font-size: 14px; }
  .pillar em { font-size: 14px; }
  .gd-brand img:first-child { width: 38px; height: 38px; }
  .gd-brand img:last-child { height: 26px; }
  .gd-globe { width: 52px; height: 52px; }
}

/* Hover: no red glows, rings or red washes. Neutral white/silver edge, plain color, image zoom stays. */
:focus-visible { outline: 2px solid #fff; }
.btn-red:hover, .btn-play:hover, .discord-pill:hover { filter: none; }
.tile { transition: transform .3s var(--ease); }
.tile:hover { filter: none; }
.tile:hover .tile-frame { --edge: rgba(255, 255, 255, .5); --fill: linear-gradient(160deg, #1b1b20, var(--panel) 65%); }
.btn-ghost:hover, .btn-dark:hover, .btn-discord:hover { --c: #fff; background-color: rgba(255, 255, 255, .08); }
.strip-link:hover { --fill: rgba(255, 255, 255, .06); }
.genre:hover, .provider:hover { --edge: rgba(255, 255, 255, .5); --fill: rgba(255, 255, 255, .06); }
a.news:hover { --edge: rgba(255, 255, 255, .5); }
.pill:hover { background: rgba(255, 255, 255, .08); }
.legend { transition: transform .35s var(--ease); }
.legend:hover { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5); }
.legend:hover .legend-rank { color: #fff; -webkit-text-stroke-color: #fff; }
.legend::after, .pillar::before { box-shadow: none; }
.pillar:hover::after { background: linear-gradient(180deg, rgba(7, 7, 8, .25), rgba(7, 7, 8, .88) 75%); }
.toc a { transition: color .2s; }
.toc a:hover { box-shadow: inset 3px 0 0 #fff; }
.btn-text:hover { color: var(--silver); box-shadow: inset 0 -2px 0 #fff; }
.more:hover { background: rgba(255, 255, 255, .1); color: #fff; }

/* Page-head counter: a western poster plate, not a spinning ring.
   Outer frame with cream corner brackets, grained inner plate, star rule, worn cream numeral, notched red ribbon label. */
.page-head .emblem { width: auto; height: auto; margin-right: 0; padding: 12px; background: rgba(8, 3, 4, .6); box-shadow: inset 0 0 0 1px rgba(239, 232, 220, .16); }
.page-head .emblem::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(var(--cream), var(--cream)) left top / 26px 2px, linear-gradient(var(--cream), var(--cream)) left top / 2px 26px,
    linear-gradient(var(--cream), var(--cream)) right top / 26px 2px, linear-gradient(var(--cream), var(--cream)) right top / 2px 26px,
    linear-gradient(var(--cream), var(--cream)) left bottom / 26px 2px, linear-gradient(var(--cream), var(--cream)) left bottom / 2px 26px,
    linear-gradient(var(--cream), var(--cream)) right bottom / 26px 2px, linear-gradient(var(--cream), var(--cream)) right bottom / 2px 26px;
  background-repeat: no-repeat; }
.page-head .emblem-dots { display: none; }
.page-head .emblem-ring { display: block; inset: 12px; z-index: 1; border-radius: 0; background: none; box-shadow: inset 0 0 0 1px rgba(239, 232, 220, .42); -webkit-mask: none; mask: none; animation: none; pointer-events: none; }
.page-head .emblem-core { position: relative; inset: auto; display: grid; justify-content: stretch; justify-items: center; gap: 0; min-width: 236px; padding: 22px 34px 0; border-radius: 0; background: url("fx/grain.webp") 0 0 / 256px, linear-gradient(180deg, #171113, #0b0708 70%); box-shadow: none; }
.page-head .emblem-core::before { content: "\2605"; display: flex; align-items: center; justify-content: center; width: 100%; color: var(--rdr-red); font-size: 15px; line-height: 1; background: linear-gradient(90deg, transparent, #b3121a) left center / calc(50% - 18px) 1px no-repeat, linear-gradient(90deg, #b3121a, transparent) right center / calc(50% - 18px) 1px no-repeat; }
.page-head .emblem-core b { margin: 14px 0 16px; color: var(--cream); font: normal 800 96px/.84 var(--slab); letter-spacing: -.02em; font-variant-numeric: tabular-nums; text-shadow: none; -webkit-mask: url("fx/grunge.webp") 0 0 / 220px repeat; mask: url("fx/grunge.webp?v=2") 0 0 / 220px repeat; }
.page-head .emblem-core small { position: relative; z-index: 2; justify-self: stretch; margin: 0 -48px; padding: 12px 30px 11px; background: var(--rdr-red); color: #fff; font: normal 700 15px/1 var(--display); letter-spacing: .14em; text-align: center; text-transform: uppercase; clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 50%, 100% 100%, 0 100%, 14px 50%); }

@media (max-width: 900px) {
  .page-head .emblem-core { min-width: 180px; padding: 18px 26px 0; }
  .page-head .emblem-core b { font-size: 74px; }
  .page-head .emblem-core small { margin: 0 -40px; font-size: 14px; }
}
@media (max-width: 640px) {
  .page-head .emblem { display: block; justify-self: center; padding: 10px; }
  .page-head .emblem-ring { inset: 10px; }
  .page-head .emblem-core { min-width: 168px; padding: 16px 24px 0; }
  .page-head .emblem-core b { margin: 10px 0 12px; font-size: 62px; }
  .page-head .emblem-core small { margin: 0 -34px; padding: 10px 24px 9px; font-size: 14px; }
}

/* B-mark glows: no pulsing red halo behind the logo (header and footer). */
.brand::before, .footer-brand > a::before { content: none; }
