/* Game page depth pack (Epic C, 2026-10-27): What moved, Earnings, History,
   Competing games, Updates, Icon history, plus the phone action bar and the
   share sheet. Tokens follow the game page's own scope (--ccu3-*) when it is
   there and the site tokens (--ccu-*) otherwise, so light and dark both work. */
.gdx,.gdx-bar,.gdx-share{
  --gdx-surface:var(--ccu3-surface,var(--ccu-bg-raised,#10151b));
  --gdx-raised:var(--ccu3-raised,var(--ccu-panel,#171e26));
  --gdx-line:var(--ccu3-edge,var(--ccu-line,rgba(255,255,255,.07)));
  --gdx-line-2:var(--ccu3-edge-ctl,var(--ccu-line-strong,rgba(255,255,255,.14)));
  --gdx-ink:var(--ccu3-text,var(--ccu-ink,#f4f7fa));
  --gdx-ink-2:var(--ccu3-text-2,var(--ccu-muted,#a5afba));
  --gdx-ink-3:var(--ccu3-text-3,var(--ccu-muted-faint,#7f8b99));
  --gdx-accent:var(--ccu3-accent,var(--ccu-accent,#42d6a0));
  --gdx-accent-ink:var(--ccu3-accent-ink,var(--ccu-accent-ink,#03241a));
  --gdx-down:var(--ccu3-down,var(--ccu-down,#f28b96));
  --gdx-compare:var(--ccu3-compare,var(--ccu-compare,#8995a7));
  --gdx-fill:var(--ccu-fill,rgba(255,255,255,.045));
  --gdx-r:var(--ccu3-r-panel,18px);
  --gdx-ease:var(--ccu3-ease,cubic-bezier(.2,0,0,1));
  font-variant-numeric:tabular-nums;
}
.gdx{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:20px}
@media (min-width:1024px){.gdx{grid-template-columns:repeat(2,minmax(0,1fr))}.gdx-wide{grid-column:1 / -1}}
.gdx-sentinel{grid-column:1 / -1;height:0}
/* Inside the game page's analysis grid the modules are the grid's own cells. */
.gd3-grid > .gdx{display:contents}
.gd3-grid > .gdx > .gdx-sentinel{margin-bottom:-20px}
.gdx-earn-detail{margin-top:14px}
.gdx-stack{display:flex;flex-direction:column;gap:20px;min-width:0}
.gdx-stack > .gdx-mod:last-child{flex:1}
/* Order in the analysis grid: What moved first, then Details beside
   Earnings + History, Competing games beside Game passes, Updates across,
   Icon history beside the server sample, then the rest. Heights pair up so
   the two columns end together. */
.gd3-grid-more > *{order:20}
.gd3-grid-more > .gdx > *{order:20}
/* 2026-10-27 owner: Revenue first (Analysis row above this grid), then
   Details, then Daily visits beside it, then What moved and the rest. */
.gd3-grid-more > .gd3-details{order:1}
.gd3-grid-more > .gd3-visits{order:2}
.gd3-grid-more > .gdx > #gdx-moved{order:3}
.gd3-grid-more > .gdx > .gdx-stack{order:3}
.gd3-grid-more > .gdx > #gdx-rivals{order:4}
.gd3-grid-more > .gd3-passes{order:5}
.gd3-grid-more > .gdx > #gdx-updates{order:6}
.gd3-grid-more > .gdx > #gdx-icons{order:7}
.gd3-grid-more > .gd3-servers{order:8}
.gd3-grid-more > .gdx > .gdx-sentinel{order:0}

/* Module card */
.gdx-mod{min-width:0;margin:0;padding:20px 24px 22px;border-radius:var(--gdx-r);background:var(--gdx-surface);border:1px solid var(--gdx-line);color:var(--gdx-ink)}
.gdx-mod-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;list-style:none;cursor:default;margin:0 0 14px}
.gdx-mod-head::-webkit-details-marker{display:none}
.gdx-mod-title{margin:0;font-size:17px;line-height:1.3;font-weight:600;letter-spacing:-.005em;color:var(--gdx-ink)}
.gdx-mod-help{display:inline-flex}
.gdx-mod-asof{margin-left:auto;font-size:12px;color:var(--gdx-ink-3)}
.gdx-mod-teaser{display:none;font-size:13px;color:var(--gdx-ink-2)}
.gdx-mod-chev{display:none;width:16px;height:16px;color:var(--gdx-ink-3);transition:transform 160ms var(--gdx-ease)}
.gdx-mod-body{min-width:0}
.gdx-note{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--gdx-ink-2)}
.gdx-foot{margin:14px 0 0;font-size:12px;color:var(--gdx-ink-3)}
.gdx-sub{margin-left:6px;font-size:12px;font-weight:400;color:var(--gdx-ink-3)}
.gdx-more{margin-top:12px;min-height:44px;padding:0 14px;border-radius:10px;border:1px solid var(--gdx-line-2);background:transparent;color:var(--gdx-ink);font-size:14px;font-weight:500;cursor:pointer;transition:background-color 160ms var(--gdx-ease)}
.gdx-more:hover{background:var(--gdx-fill)}
.gdx-chg{display:inline-block;margin-left:8px;font-size:13px;font-weight:600;color:var(--gdx-ink-2)}
.gdx-chg-up{color:var(--gdx-accent)}
.gdx-chg-down{color:var(--gdx-down)}
.gdx-skel{min-height:180px;background:linear-gradient(90deg,var(--gdx-surface),var(--gdx-raised),var(--gdx-surface));background-size:200% 100%;animation:gdx-shimmer 1.4s linear infinite}
@keyframes gdx-shimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.gdx-skel{animation:none}}
.gdx-error p{margin:0;color:var(--gdx-ink-2);font-size:14px}

/* Lock */
.gdx-lock{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--gdx-fill)}
.gdx-lock-icon{width:20px;height:20px;flex:none;color:var(--gdx-ink-2)}
.gdx-lock-text{flex:1 1 220px;margin:0;font-size:14px;line-height:1.45;color:var(--gdx-ink)}
.gdx-lock-cta{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:12px;background:var(--gdx-raised);box-shadow:inset 0 0 0 1px var(--gdx-line-2);color:var(--gdx-ink);font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap;transition:background-color 160ms var(--gdx-ease)}
.gdx-lock-cta:hover{background:var(--ccu3-raised-2,var(--gdx-fill))}
.gdx-pro-tag{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid var(--gdx-line-2);font-size:11px;font-weight:600;color:var(--gdx-ink-2)}

/* What moved */
.gdx-moved-sentence{margin:0;font-size:20px;line-height:1.35;font-weight:600;letter-spacing:-.01em;color:var(--gdx-ink);max-width:62ch}
.gdx-moved-basis{margin:8px 0 0;font-size:14px;color:var(--gdx-ink-2)}
.gdx-moved-basis strong{color:var(--gdx-ink);font-weight:600}
.gdx-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.gdx-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 12px;border-radius:999px;font-size:13px;color:var(--gdx-ink-2);background:var(--gdx-fill)}
.gdx-chip-primary{color:var(--gdx-ink);background:transparent;box-shadow:inset 0 0 0 1px var(--gdx-accent)}
.gdx-chip-icon{width:15px;height:15px;flex:none}
.gdx-chip-primary .gdx-chip-icon{color:var(--gdx-accent)}

/* History */
.gdx-hist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px;margin:0}
.gdx-hist div{min-width:0}
.gdx-hist dt{font-size:12px;color:var(--gdx-ink-3)}
.gdx-hist dd{margin:4px 0 0;font-size:16px;font-weight:600;color:var(--gdx-ink)}
.gdx-hist .gdx-sub{display:block;margin:2px 0 0}

/* Earnings */
.gdx-est{margin:0;font-size:12px;font-weight:500;color:var(--gdx-ink-3)}
.gdx-earn-big{margin:6px 0 0;font-size:28px;line-height:1.1;font-weight:600;letter-spacing:-.02em;color:var(--gdx-ink)}
.gdx-earn-to{font-size:16px;font-weight:500;color:var(--gdx-ink-3)}
.gdx-range{position:relative;height:28px;margin:14px 0 6px}
.gdx-range-track{position:absolute;left:0;right:0;top:12px;height:4px;border-radius:2px;background:var(--gdx-fill)}
.gdx-range-fill{position:absolute;top:12px;height:4px;border-radius:2px;background:linear-gradient(90deg,color-mix(in srgb,var(--gdx-accent) 35%,transparent),var(--gdx-accent))}
.gdx-range-mid{position:absolute;top:5px;width:2px;height:18px;margin-left:-1px;border-radius:1px;background:var(--gdx-ink)}
.gdx-range-rank{position:absolute;top:8px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--gdx-surface);box-shadow:inset 0 0 0 2px var(--gdx-compare)}
.gdx-range-ghost .gdx-range-track{background:repeating-linear-gradient(90deg,var(--gdx-fill) 0 10px,transparent 10px 16px)}
.gdx-earn-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:4px 0 0}
.gdx-earn-legend dt{font-size:12px;color:var(--gdx-ink-3)}
.gdx-earn-legend dd{margin:2px 0 0;font-size:15px;font-weight:600;color:var(--gdx-ink)}

/* Updates */
.gdx-upd{margin:0;padding:0;list-style:none}
.gdx-upd-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;padding:12px 0;border-top:1px solid var(--gdx-line)}
.gdx-upd-row:first-child{border-top:0;padding-top:0}
.gdx-upd-title{margin:0;font-size:15px;font-weight:600;color:var(--gdx-ink)}
.gdx-upd-detail{margin:4px 0 0;font-size:13px;line-height:1.45;color:var(--gdx-ink-2);overflow-wrap:anywhere}
.gdx-q{color:var(--gdx-ink)}
.gdx-q-block{display:block;margin-top:4px;padding-left:10px;border-left:2px solid var(--gdx-line-2);color:var(--gdx-ink-2)}
.gdx-upd-impact{display:flex;gap:18px;align-items:flex-start}
.gdx-imp{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:6px;min-width:120px}
.gdx-imp-label{grid-column:1 / -1;font-size:11px;font-weight:500;color:var(--gdx-ink-3)}
.gdx-imp-vals{font-size:14px;color:var(--gdx-ink)}
.gdx-imp-vals em{font-style:normal;color:var(--gdx-ink-3)}
.gdx-imp .gdx-chg{margin-left:0;font-size:12px;align-self:center}

/* Icons */
.gdx-icons{display:flex;gap:14px;margin:0;padding:2px 2px 6px;list-style:none;overflow-x:auto;scroll-snap-type:x proximity}
.gdx-icon{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:4px;scroll-snap-align:start}
.gdx-icon-img{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:16px;object-fit:cover;background:var(--gdx-raised);box-shadow:inset 0 0 0 1px var(--gdx-line)}
.gdx-icon-now .gdx-icon-img{box-shadow:0 0 0 2px var(--gdx-surface),0 0 0 3px var(--gdx-ink-3)}
.gdx-icon-gone{font-size:11px;color:var(--gdx-ink-3)}
.gdx-icon-date{margin-top:4px;font-size:11px;color:var(--gdx-ink-3)}
.gdx-icon-when{font-size:13px;font-weight:500;color:var(--gdx-ink)}

/* Competing games */
.gdx-riv{margin:0;padding:0;list-style:none}
.gdx-riv-rank{margin:0 0 10px}
.gdx-riv-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto auto;align-items:center;gap:12px;min-height:56px;padding:8px 10px;margin:0 -10px;border-radius:12px}
.gdx-riv-self{background:var(--gdx-fill)}
.gdx-riv-quiet{opacity:.7}
.gdx-riv-icon{width:36px;height:36px;border-radius:9px;object-fit:cover}
.gdx-riv-main{min-width:0;display:flex;flex-direction:column;gap:3px}
.gdx-riv-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;color:var(--gdx-ink);text-decoration:none}
a.gdx-riv-name:hover{text-decoration:underline;text-underline-offset:3px}
.gdx-riv-chips{display:flex;gap:4px;flex-wrap:wrap}
.gdx-tag{display:inline-block;padding:1px 7px;border-radius:999px;font-size:11px;line-height:16px;color:var(--gdx-ink-2);background:var(--gdx-fill)}
.gdx-tag-self{color:var(--gdx-ink)}
.gdx-spark{display:block;color:var(--gdx-compare)}
.gdx-spark-self{color:var(--gdx-accent)}
.gdx-spark-empty{width:88px;height:26px}
.gdx-riv-num{display:flex;flex-direction:column;align-items:flex-end;min-width:58px}
.gdx-riv-ccu{font-size:15px;font-weight:600;color:var(--gdx-ink)}
.gdx-riv-num .gdx-chg{margin:0;font-size:12px}

/* Phones: accordion rows */
@media (max-width:639.98px){
  .gdx{gap:10px}
  .gdx-mod{padding:0;border-radius:16px}
  .gdx-mod-head{margin:0;min-height:56px;padding:12px 16px;cursor:pointer}
  .gdx-mod[open] .gdx-mod-head{padding-bottom:6px}
  .gdx-mod-teaser{display:inline;margin-left:auto;text-align:right}
  .gdx-mod-asof{display:none}
  .gdx-mod-chev{display:block;margin-left:auto}
  .gdx-mod-teaser ~ .gdx-mod-chev{margin-left:0}
  .gdx-mod[open] .gdx-mod-chev{transform:rotate(180deg)}
  .gdx-mod-body{padding:4px 16px 16px}
  .gdx-mod.gdx-skel,.gdx-mod.gdx-error{padding:16px}
  .gdx-moved-sentence{font-size:17px}
  .gdx-hist{grid-template-columns:1fr 1fr}
  .gdx-upd-row{grid-template-columns:minmax(0,1fr)}
  .gdx-upd-impact{gap:14px}
  .gdx-riv-row{grid-template-columns:32px minmax(0,1fr) auto;gap:10px}
  .gdx-riv-icon{width:32px;height:32px}
  .gdx-riv-row .gdx-spark,.gdx-riv-row .gdx-spark-empty{display:none}
  .gdx-earn-big{font-size:24px}
}

/* Phone action bar: Watch, Alert, Share above the tab bar */
.gdx-bar,.gdx-bar-spacer{display:none}
@media (max-width:639.98px){
  .gdx-bar{position:fixed;left:12px;right:12px;bottom:calc(var(--ccu-tabbar-space,0px) + 10px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;gap:8px;padding:6px;border-radius:16px;background:color-mix(in srgb,var(--gdx-raised) 92%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 30px -12px rgba(0,0,0,.55),inset 0 0 0 1px var(--gdx-line-2);transform:translateY(0);transition:transform 180ms var(--gdx-ease),opacity 180ms var(--gdx-ease)}
  .gdx-bar[data-hidden]{transform:translateY(140%);opacity:0;pointer-events:none}
  .gdx-bar-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:12px;border:0;background:transparent;color:var(--gdx-ink);font-size:15px;font-weight:600;text-decoration:none;cursor:pointer}
  .gdx-bar-btn svg{width:18px;height:18px}
  .gdx-bar-primary{background:var(--gdx-accent);color:var(--gdx-accent-ink)}
  .gdx-bar-primary[aria-pressed="true"]{background:transparent;color:var(--gdx-ink);box-shadow:inset 0 0 0 1px var(--gdx-accent)}
  .gdx-bar-spacer{display:block;height:72px}
  /* The bar carries Watch and Share on phones; the pinned header keeps Play. */
  .gd-page:has(.gdx-bar:not([data-hidden])) .gd3-actions .gd3-share,
  .gd-page:has(.gdx-bar:not([data-hidden])) .gd3-actions .gd3-watch,
  .gd3-actions .gd3-share{display:none}
}
@media (prefers-reduced-motion:reduce){.gdx-bar{transition:none}}

/* Share sheet */
.gdx-share-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;min-width:44px;padding:0 16px;border-radius:12px;border:1px solid var(--gdx-line-2,rgba(255,255,255,.14));background:transparent;color:inherit;font-size:15px;font-weight:600;cursor:pointer}
.gdx-share-trigger svg{width:18px;height:18px}
.gdx-share{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.45)}
@media (min-width:640px){.gdx-share{align-items:center}}
.gdx-share-card{width:min(440px,100%);max-height:90svh;overflow:auto;padding:20px 20px calc(20px + env(safe-area-inset-bottom,0px));border-radius:22px 22px 0 0;background:var(--gdx-raised);color:var(--gdx-ink);box-shadow:0 20px 50px -20px rgba(0,0,0,.6),inset 0 0 0 1px var(--gdx-line)}
@media (min-width:640px){.gdx-share-card{border-radius:22px}}
.gdx-share-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.gdx-share-title{margin:0;font-size:17px;font-weight:600}
.gdx-share-close{width:44px;height:44px;border-radius:12px;border:0;background:transparent;color:var(--gdx-ink-2);font-size:22px;cursor:pointer}
.gdx-share-preview{display:block;width:100%;aspect-ratio:1200 / 630;border-radius:14px;object-fit:cover;background:var(--gdx-surface);box-shadow:inset 0 0 0 1px var(--gdx-line)}
.gdx-share-actions{display:grid;grid-template-columns:1fr;gap:8px;margin-top:14px}
.gdx-share-act{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border-radius:12px;border:0;background:var(--gdx-fill);color:var(--gdx-ink);font-size:15px;font-weight:500;text-align:left;text-decoration:none;cursor:pointer;transition:background-color 160ms var(--gdx-ease)}
.gdx-share-act:hover{background:color-mix(in srgb,var(--gdx-fill) 100%,var(--gdx-ink) 6%)}
.gdx-share-act svg{width:18px;height:18px;flex:none;color:var(--gdx-ink-2)}
.gdx-share-act small{margin-left:auto;font-size:12px;color:var(--gdx-accent)}
.gdx-share-text{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--gdx-surface);font-size:13px;line-height:1.45;color:var(--gdx-ink-2);white-space:pre-wrap;overflow-wrap:anywhere}

/* What moved, owner feedback 2026-10-27 (charts-section agent): the basis
   sentence became a comparison row; evidence chips are short, higher contrast,
   14px / 500 with the icon in the text colour. Chart places moved to their own
   row (game-charts.css). */
.gdx-cmp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--gdx-line)}
.gdx-cmp-item{min-width:0;margin:0;padding:0 16px}
.gdx-cmp-item:first-child{padding-left:0}
.gdx-cmp-item + .gdx-cmp-item{border-left:1px solid var(--gdx-line)}
.gdx-cmp dt{margin:0;font-size:13px;line-height:1.3;font-weight:400;color:var(--gdx-ink-2)}
.gdx-cmp dd{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:4px 0 0}
.gdx-cmp-val{font-size:21px;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:var(--gdx-ink);font-variant-numeric:tabular-nums}
.gdx-cmp-none{font-size:15px;line-height:1.6;font-weight:500;color:var(--gdx-ink-3)}
.gdx-cmp-chg{display:inline-flex;align-items:center;gap:3px;height:22px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.gdx-cmp-chg svg{width:9px;height:9px}
.gdx-cmp-chg-up{color:var(--gdx-accent);background:color-mix(in srgb,var(--gdx-accent) 13%,transparent)}
.gdx-cmp-chg-down{color:var(--gdx-down);background:color-mix(in srgb,var(--gdx-down) 13%,transparent)}
.gdx-chips{gap:8px;margin-top:14px}
.gdx-chip{min-height:32px;padding:4px 12px 4px 10px;font-size:14px;font-weight:500;color:var(--gdx-ink-2);background:var(--gdx-raised);box-shadow:inset 0 0 0 1px var(--gdx-line)}
.gdx-chip .gdx-chip-icon{color:currentColor}
.gdx-chip-primary{color:var(--gdx-ink);background:var(--gdx-raised);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gdx-accent) 55%,transparent)}
.gdx-chip-primary .gdx-chip-icon{color:var(--gdx-accent)}
[data-theme="light"] .gdx-chip{background:#f3f5f8;box-shadow:inset 0 0 0 1px rgba(16,24,40,.08);color:#3d4652}
[data-theme="light"] .gdx-chip-primary{color:#111827}
@media (max-width:639.98px){
  .gdx-cmp-item{padding:0 10px}
  .gdx-cmp dt{font-size:12px}
  .gdx-cmp-val{font-size:19px}
  .gdx-chip{font-size:13px}
}

/* >>> Competing games, ranked list (competition agent, 2026-10-27).
   Rank (medal for the top three) | icon | name | players now | change; the
   numbers sit in fixed tabular columns, so names truncate first. This game
   sits on a raised pill. Rollback: delete this block down to the end marker. */
#gdx-rivals{
  --hof-self:var(--ccu3-raised,var(--gdx-raised));
  --hof-self-edge:var(--gdx-line);
  --hof-self-shadow:0 10px 22px -16px rgba(0,0,0,.7);
  --hof-hover:var(--ccu-fill,rgba(255,255,255,.045));
  --hof-up:var(--ccu-up,#42d6a0);
  --hof-down:var(--ccu-down,var(--gdx-down));
  --hof-icon-edge:rgba(255,255,255,.08);
  --hof-ccu-w:50px;
  --hof-chg-w:56px;
}
[data-theme="light"] #gdx-rivals{
  --hof-self:var(--ccu3-raised-2,#f0f0f2);
  --hof-self-edge:rgba(0,0,0,.05);
  --hof-self-shadow:none;
  --hof-hover:rgba(0,0,0,.035);
  --hof-icon-edge:rgba(0,0,0,.08);
}
.gdx-mod-action{display:inline-flex;margin-left:auto}
.gdx-mod-asof ~ .gdx-mod-action{margin-left:12px}
.gdx-hof-all{min-height:32px;margin:-6px -10px -6px 0;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--gdx-ink-2);font:inherit;font-size:14px;font-weight:500;cursor:pointer;transition:background-color 140ms var(--gdx-ease),color 140ms var(--gdx-ease)}
.gdx-hof-all:hover{background:var(--hof-hover);color:var(--gdx-ink)}
.gdx-hof-all:focus-visible{outline:2px solid var(--ccu-focus,currentColor);outline-offset:2px}
.gdx-hof{display:flex;flex-direction:column;gap:2px;margin:4px -12px 0;padding:0;list-style:none}
.gdx-hof-item{margin:0}
.gdx-hof-row{display:grid;grid-template-columns:32px 44px minmax(0,1fr) var(--hof-ccu-w) var(--hof-chg-w);align-items:center;column-gap:10px;min-height:64px;padding:10px 14px 10px 10px;border-radius:999px;color:var(--gdx-ink);text-decoration:none;transition:background-color 140ms var(--gdx-ease)}
a.gdx-hof-row:hover{background:var(--hof-hover)}
a.gdx-hof-row:focus-visible{outline:2px solid var(--ccu-focus,currentColor);outline-offset:-2px}
.gdx-hof-self .gdx-hof-row{background:var(--hof-self);box-shadow:inset 0 0 0 1px var(--hof-self-edge),var(--hof-self-shadow)}
.gdx-hof-quiet .gdx-hof-row{opacity:.62}
.gdx-hof-pos{justify-self:center;font-size:14px;font-weight:500;color:var(--gdx-ink-3);font-variant-numeric:tabular-nums}
.gdx-hof-medal{justify-self:center}
.gdx-hof-icon{display:block;width:44px;height:44px;border-radius:12px;object-fit:cover;outline:1px solid var(--hof-icon-edge);outline-offset:-1px}
.gdx-hof-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;line-height:1.3;font-weight:500;letter-spacing:-.005em}
.gdx-hof-ccu{text-align:right;font-size:15px;font-weight:600;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.gdx-hof-chg{display:inline-flex;align-items:center;justify-content:flex-end;gap:4px;font-size:14px;font-weight:500;color:var(--gdx-ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.gdx-hof-up{color:var(--hof-up)}
.gdx-hof-down{color:var(--hof-down)}
.gdx-hof-arrow{flex:none;width:9px;height:9px}
.gdx-hof-compare{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;font-size:14px;font-weight:500;color:var(--gdx-ink-2);text-decoration:none}
.gdx-hof-compare:hover{color:var(--gdx-ink);text-decoration:underline;text-underline-offset:3px}
/* The rank medal, finished for the list: a metal-tinted face, a crisp ring
   and a soft halo in the tier colour (CCUCheck's own ring, no laurels). */
.gdx-hof .ccu-rank.gdx-hof-medal{width:32px;height:32px;font-size:14px;font-weight:700}
.gdx-hof .ccu-rank.gdx-hof-medal[data-tier]{background:radial-gradient(circle at 32% 26%,color-mix(in srgb,var(--ccu-rank-solid) 34%,transparent) 0%,color-mix(in srgb,var(--ccu-rank-solid) 12%,transparent) 58%,color-mix(in srgb,var(--ccu-rank-solid) 6%,transparent) 100%);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ccu-rank-solid) 78%,transparent),inset 0 2px 1px -1px rgba(255,255,255,.28),0 0 0 3px color-mix(in srgb,var(--ccu-rank-solid) 10%,transparent),0 6px 14px -6px color-mix(in srgb,var(--ccu-rank-solid) 60%,transparent)}
@media (max-width:639.98px){
  #gdx-rivals{--hof-ccu-w:46px;--hof-chg-w:52px}
  #gdx-rivals[open] .gdx-mod-teaser{display:none}
  #gdx-rivals:not([open]) .gdx-mod-action{display:none}
  #gdx-rivals .gdx-mod-action{margin-left:auto}
  #gdx-rivals .gdx-mod-action ~ .gdx-mod-chev{margin-left:0}
  .gdx-hof{margin:0 -8px}
  .gdx-hof-row{grid-template-columns:28px 44px minmax(0,1fr) var(--hof-ccu-w) var(--hof-chg-w);column-gap:9px;min-height:60px;padding:8px 12px 8px 8px}
  .gdx-hof .ccu-rank.gdx-hof-medal{width:28px;height:28px;font-size:13px}
  .gdx-hof-chg{font-size:13px}
}
@media (prefers-reduced-motion:reduce){.gdx-hof-row,.gdx-hof-all{transition:none}}
/* <<< Competing games, ranked list (end). */
/* 2026-10-27 (owner): on phones Watch / Alert / Share sit in the pinned header as a compact pill row,
   not a floating bar above the tab bar. Desktop keeps its header buttons, so the row is phone-only. */
@media (max-width:639.98px){
  .gdx-bar.gdx-bar-inline{position:static;left:auto;right:auto;bottom:auto;z-index:auto;margin-top:8px;padding:0;gap:6px;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border-radius:0;transform:none;opacity:1;pointer-events:auto}
  .gdx-bar-inline .gdx-bar-btn{flex:0 0 auto;min-height:34px;height:34px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:600;gap:6px;background:var(--ccu3-raised,rgba(255,255,255,.07));box-shadow:inset 0 0 0 1px var(--ccu3-line,rgba(255,255,255,.08))}
  .gdx-bar-inline .gdx-bar-btn svg{width:16px;height:16px}
  .gdx-bar-inline .gdx-bar-primary{background:var(--ccu3-text,#f4f7fa);color:var(--ccu3-canvas,#090c10);box-shadow:none}
  .gdx-bar-inline .gdx-bar-primary[aria-pressed="true"]{background:var(--ccu3-raised,rgba(255,255,255,.07));color:var(--ccu3-text,#f4f7fa);box-shadow:inset 0 0 0 1px var(--ccu3-line,rgba(255,255,255,.12))}
  [data-theme="light"] .gdx-bar-inline .gdx-bar-btn{background:#fff;box-shadow:inset 0 0 0 1px rgba(16,24,40,.10)}
  [data-theme="light"] .gdx-bar-inline .gdx-bar-primary{background:#0B0D12;color:#fff;box-shadow:none}
  [data-theme="light"] .gdx-bar-inline .gdx-bar-primary[aria-pressed="true"]{background:#fff;color:#0B0D12;box-shadow:inset 0 0 0 1px rgba(16,24,40,.18)}
}
@media (max-width:639.98px){
  .gdx-bar-inline .gdx-bar-bell{width:34px;padding:0;justify-content:center}
  .gdx-bar-inline .gdx-bar-bell[aria-pressed="true"]{color:var(--ccu3-accent,#5ab8d6);box-shadow:inset 0 0 0 1px currentColor}
  [data-theme="light"] .gdx-bar-inline .gdx-bar-bell[aria-pressed="true"]{color:#0b6e8a;box-shadow:inset 0 0 0 1px currentColor}
}
