@font-face {
  font-family: 'GAMEFIRST Display';
  src: url('./NeueHaasDisplayBold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}

/* Palette, type and cards from GAMEFIRST.PRO/css/index/portfolio.css. */
.gamefirst-control {
  appearance: none;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(140deg, #1c1c22 80%, #2b2b36 100%);
  color: #fff;
  border: 1px solid rgb(255 255 255 / 6%);
  border-radius: 16px;
  box-shadow: 0 4px 18px rgb(0 0 0 / 35%);
  font: 700 clamp(14px, 2.2vh, 26px)/1.2 'GAMEFIRST Display', var(--font-main, sans-serif);
  text-align: center;
  text-decoration: none;
  padding: 10px 16px;
  min-height: 44px;
  cursor: pointer;
  transition: border-color .18s, box-shadow .18s, transform .12s;
}
.gamefirst-control:focus-visible {
  outline: none;
  border-color: #b9a3ff;
  box-shadow: inset 0 0 0 2px #b9a3ff;
}
@media (hover: hover) {
  .gamefirst-control:hover:not(:disabled) {
    border-color: rgb(255 255 255 / 25%);
    box-shadow: 0 6px 22px rgb(0 0 0 / 50%);
  }
}
.gamefirst-control:active:not(:disabled) { transform: scale(.97); }
.gamefirst-control:disabled { opacity: .35; cursor: default; }
.gamefirst-catalog[hidden] { display: none; }
.gamefirst-catalog {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: #0d0d0d;
  color: #fff;
  display: grid;
  place-items: center;
  grid-template-rows: minmax(0, 1fr);
  padding: max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  box-sizing: border-box;
  overflow: hidden;
  font-family: 'GAMEFIRST Display', var(--font-main, sans-serif);
}
.gamefirst-frame {
  width: min(100%, 1800px);
  min-width: 0;
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: clamp(10px, 2.2vh, 28px);
}
.gamefirst-heading { text-align: center; }
.gamefirst-heading h2 {
  margin: 0;
  font: 700 clamp(22px, 5vmin, 60px)/1.1 'GAMEFIRST Display', sans-serif;
  background: linear-gradient(115deg, #fff 20%, #b8dfff 48%, #c1a0ff 72%, #fff);
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}
.gamefirst-heading p { margin: 5px 0 0; color: #d6d6de; font-size: clamp(12px, 1.8vh, 22px); }
.gamefirst-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 2.2vh, 28px);
}
.gamefirst-card {
  min-width: 0;
  min-height: 0;
  padding: clamp(8px, 1.6vh, 20px);
  flex-direction: column;
  gap: clamp(5px, 1vh, 12px);
}
.gamefirst-card img {
  width: auto;
  height: calc(100% - 2.8em);
  max-width: 78%;
  max-height: 70%;
  aspect-ratio: 1;
  object-fit: contain;
  border-radius: 14px;
}
.gamefirst-card span { flex-shrink: 0; }
.gamefirst-links { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; grid-template-rows: none; }
.gamefirst-footer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(8px, 2vh, 24px); }
.gamefirst-footer .gamefirst-control { min-width: 0; }
@media (orientation: portrait) {
  .gamefirst-grid:not(.gamefirst-links) { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); }
  .gamefirst-control { font-size: 14px; padding-inline: 8px; }
}
@media (prefers-reduced-motion: reduce) { .gamefirst-control { transition: none; } }


.gamefirst-heading { position: relative; min-height: 56px; padding: clamp(12px, 2vh, 24px) 0 0; }
.gamefirst-brand { display: flex; justify-content: center; align-items: center; gap: clamp(8px, 1.5vh, 18px); }
.gamefirst-brand img { width: clamp(30px, 5vh, 60px); height: clamp(30px, 5vh, 60px); object-fit: contain; border-radius: 50%; }
.gamefirst-footer .gamefirst-close { grid-column: 3; padding: 4px; }
.gamefirst-close img { width: 36px; height: 36px; object-fit: contain; }

.gamefirst-frame--no-footer { grid-template-rows: auto minmax(0, 1fr); }

/* Horizontal gestures belong to the collection; vertical intent is not paging. */
.gamefirst-grid:not(.gamefirst-links) { touch-action: pan-y; user-select: none; }
.gamefirst-card img { -webkit-user-drag: none; }

/* GAMEFIRST Connect shares the catalogue's brand, controls and offline art. */
.gamefirst-catalog{--connect-paper:#fff;--connect-muted:#c9c9d4;--connect-accent:#c1a0ff;--connect-surface:#1c1c22;--connect-line:#36363f}
.gamefirst-frame{width:100%;max-width:none;gap:clamp(8px,1.7vh,24px)}
.connect-header{display:grid;grid-template-columns:1fr auto auto;grid-template-rows:auto auto;align-items:center;gap:clamp(8px,1.4vh,20px);padding:0;min-height:0;text-align:left}
.connect-header .gamefirst-brand{justify-content:flex-start;font-size:clamp(18px,3.3vmin,52px);grid-column:1;grid-row:1;min-width:0}
.connect-header .gamefirst-brand img{width:clamp(26px,4.5vmin,58px);height:clamp(26px,4.5vmin,58px)}
.connect-header .gamefirst-close{grid-column:3;grid-row:1;width:clamp(44px,5vmin,72px);height:clamp(44px,5vmin,72px);padding:4px}
.connect-header .connect-language{grid-column:2;grid-row:1}
.connect-language{background:var(--connect-surface);color:var(--connect-paper);border:0;border-radius:12px;min-height:44px;padding:8px 12px;font:inherit;max-width:180px}
.connect-tabs{grid-column:1/-1;grid-row:2;display:flex;gap:clamp(16px,3vw,46px);border-bottom:1px solid var(--connect-line)}
.connect-tabs .gamefirst-control{background:transparent;border:0;border-radius:0;box-shadow:none;padding:8px 0 12px;color:var(--connect-muted);font-size:clamp(16px,2.3vmin,32px)}
.connect-tabs .gamefirst-control[aria-pressed=true]{color:var(--connect-paper);box-shadow:0 2px var(--connect-accent)}
.connect-article{box-sizing:border-box;min-width:0;min-height:0;width:100%;display:flex;flex-direction:column;align-items:stretch;padding:clamp(4px,1vh,14px) clamp(8px,3vw,100px);overflow:hidden;font-family:Arial,sans-serif}
.connect-meta,.connect-fallback{flex:none;color:var(--connect-accent);font-size:clamp(12px,1.6vmin,24px)}
.connect-article h1{flex:none;font:700 clamp(20px,3.7vmin,64px)/1.12 'GAMEFIRST Display',Arial,sans-serif;margin:clamp(6px,1.3vh,20px) 0;letter-spacing:-.02em}
.connect-copy{min-height:0;flex:1;white-space:pre-wrap;overflow:hidden;font-size:clamp(14px,2.05vmin,34px);line-height:1.42;color:var(--connect-muted)}
.connect-article-bottom{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:8px;padding-top:clamp(6px,1.3vh,20px)}
.connect-actions{grid-column:3;grid-row:1;display:flex;justify-content:flex-end;align-items:end;gap:12px;flex-wrap:wrap;min-width:0}
.connect-actions .gamefirst-control{font-family:'GAMEFIRST Display',sans-serif;font-size:clamp(14px,1.9vmin,28px);background:var(--connect-paper);color:#0d0d0d;border:0;box-shadow:none;min-height:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.connect-author{grid-column:1;grid-row:1;align-self:center;margin:0;font-size:clamp(14px,1.85vmin,28px);color:var(--connect-paper)}
.connect-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;width:100%;border-top:1px solid var(--connect-line);padding-top:clamp(6px,1vh,16px)}
.connect-pager,.connect-parts{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2vw,30px);font-size:clamp(14px,1.9vmin,28px)}
.connect-pager{margin-left:auto}
.connect-parts{grid-column:2;grid-row:1;align-self:center;min-height:28px;height:28px;margin:0;font-size:clamp(12px,1.6vmin,22px)}
.connect-parts .gamefirst-control{min-height:28px;padding:2px 12px;font:inherit;background:none;box-shadow:none;border:0}
.connect-hide{display:flex;align-items:center;gap:10px;font-size:clamp(13px,1.9vmin,28px);min-height:44px;color:var(--connect-muted)}
.connect-hide input{width:20px;height:20px;accent-color:var(--connect-accent)}
.connect-status{font-size:clamp(18px,3vmin,42px);margin:auto;text-align:center;color:var(--connect-muted)}
.connect-leave{position:absolute;inset:0;background:#0d0d0d;z-index:10;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;align-items:center;gap:16px;padding:30px}
.connect-leave h2,.connect-leave p{width:100%;text-align:center;font:inherit;font-size:clamp(20px,3vmin,44px);color:var(--connect-paper)}
.connect-project{align-self:flex-start;min-height:34px;font-size:clamp(14px,1.8vmin,26px);padding:4px 10px}
@media(max-width:540px) and (orientation:portrait){.connect-header{grid-template-columns:1fr auto}.connect-header .connect-language{grid-column:1;grid-row:2;justify-self:start;max-width:100%}.connect-header .gamefirst-close{grid-column:2}.connect-tabs{grid-row:3}.connect-article{padding-inline:0}.connect-article-bottom{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.connect-actions{grid-column:2}.connect-parts{grid-column:1/-1;grid-row:2}.connect-footer{justify-content:center}.connect-pager{margin:0}.connect-hide{width:100%;justify-content:center}.connect-copy{font-size:15px}.connect-article h1{font-size:25px}}
@media(max-height:450px) and (orientation:landscape){.gamefirst-catalog{padding:8px 16px}.connect-header{gap:4px}.connect-header .gamefirst-brand{font-size:21px}.connect-header .gamefirst-brand img{width:28px;height:28px}.connect-tabs .gamefirst-control{padding:4px 0;min-height:34px}.connect-article{padding:0 14px}.connect-meta{font-size:11px}.connect-article h1{font-size:21px;margin:4px 0}.connect-copy{font-size:14px;line-height:1.32}.connect-article-bottom{padding-top:4px}.connect-author{margin:0}.connect-parts{height:26px;min-height:26px}.connect-footer{padding-top:4px}.connect-actions .gamefirst-control{min-height:40px;padding:5px 12px}}

/* Shared responsive history cards: complete text first, no empty paging toolbar. */
.connect-feed-grid{display:grid;grid-template-columns:repeat(var(--connect-columns,1),minmax(0,1fr));gap:clamp(12px,2vw,30px);min-height:0;min-width:0;overflow:hidden}
.connect-feed-grid .connect-status{grid-column:1/-1}
.connect-feed-grid:has(>article:nth-child(2)) .connect-article{padding-inline:clamp(8px,1.2vw,30px);border-inline-start:1px solid var(--connect-line)}
.connect-feed-grid:has(>article:nth-child(2)) .connect-article h1{font-size:clamp(22px,3vmin,48px)}
.connect-feed-grid:has(>article:nth-child(2)) .connect-article-bottom{grid-template-columns:minmax(0,1fr) auto;gap:8px}
.connect-feed-grid:has(>article:nth-child(2)) .connect-actions{grid-column:2}
.connect-feed-grid:has(>article:nth-child(2)) .connect-parts{grid-column:1/-1;grid-row:2}
.connect-parts[hidden]{display:none}
.connect-header .connect-project{grid-column:1/-1;grid-row:3;width:min(500px,100%);max-width:100%}
@media(max-width:540px) and (orientation:portrait){.connect-header .connect-project{grid-row:4}}
/* 1.2.16: when the header row has room, the project selector sits between the brand and the language, so its former row goes to the news text. Narrow screens keep it on its own row. */
@media(min-width:640px){
.connect-header{grid-template-columns:auto minmax(0,1fr) auto auto}
.connect-header .connect-project{grid-column:2;grid-row:1;align-self:center;justify-self:center;width:100%;max-width:min(500px,100%);min-width:0;min-height:44px;text-overflow:ellipsis}
.connect-header .connect-language:not(.connect-project){grid-column:3}
.connect-header .gamefirst-close{grid-column:4}
}

/* 1.2.17: project and language choices open a full-screen in-catalogue picker; native <select> popups fail inside game WebViews. */
.connect-picker-trigger{appearance:none;box-sizing:border-box;display:inline-flex;align-items:center;gap:8px;min-width:0;text-align:start;cursor:pointer;border:1px solid transparent;transition:border-color .18s,box-shadow .18s,transform .12s;touch-action:manipulation;user-select:none}
.connect-picker-trigger img{width:clamp(24px,3.4vmin,44px);height:clamp(24px,3.4vmin,44px);flex:none;object-fit:contain;border-radius:8px;pointer-events:none;-webkit-user-drag:none}
.connect-picker-trigger span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.connect-picker-trigger::after{content:'';flex:none;width:.42em;height:.42em;margin:0 .2em -.05em .3em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-25%) rotate(45deg)}
.connect-picker-trigger:focus-visible{outline:none;border-color:#b9a3ff;box-shadow:inset 0 0 0 1px #b9a3ff}
@media (hover:hover){.connect-picker-trigger:hover{border-color:rgb(255 255 255 / 25%)}}
.connect-picker-trigger:active{transform:scale(.97)}
.connect-picker{position:absolute;inset:0;z-index:9;background:#0d0d0d;display:grid;grid-template-rows:auto minmax(0,1fr);gap:clamp(10px,2.2vh,28px);padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));box-sizing:border-box;overflow:hidden}
.connect-picker-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;border-bottom:1px solid var(--connect-line);padding-bottom:clamp(6px,1.2vh,16px)}
.connect-picker-head h2{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 clamp(20px,3.3vmin,52px)/1.1 'GAMEFIRST Display',sans-serif;color:var(--connect-paper)}
.connect-picker-head .gamefirst-close{flex:none;width:clamp(44px,5vmin,72px);height:clamp(44px,5vmin,72px);padding:4px}
.connect-picker-grid{min-width:0;min-height:0;display:grid;grid-template-columns:repeat(var(--connect-picker-columns,3),minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:clamp(8px,1.8vh,24px);user-select:none}
.connect-picker-item{min-width:0;min-height:0;flex-direction:column;gap:clamp(4px,1vh,12px);padding:clamp(6px,1.4vh,18px);font-size:clamp(14px,2vmin,28px)}
.connect-picker-item img{flex:1 1 0;min-height:0;width:100%;max-width:clamp(64px,26vmin,600px);object-fit:contain;border-radius:14px;pointer-events:none;-webkit-user-drag:none}
.connect-picker-item span{flex:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.connect-picker-item[aria-selected=true]{border-color:var(--connect-accent);box-shadow:inset 0 0 0 2px var(--connect-accent)}
.connect-picker-grid--text .connect-picker-item{flex-direction:row;padding-block:4px;font-size:clamp(14px,2.2vmin,30px)}
@media(max-height:450px) and (orientation:landscape){.connect-picker{padding:8px 16px;gap:8px}.connect-picker-head{padding-bottom:4px}.connect-picker-head h2{font-size:21px}.connect-picker-grid{gap:8px}}

/* 1.2.18: the project picker pages six tiles with Previous/Next and horizontal swipe, matching the Projects tab grid. */
.connect-picker-grid--pages{touch-action:pan-y}
.connect-picker--pages{grid-template-rows:auto minmax(0,1fr) auto}
.connect-picker-grid--pages{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));grid-auto-rows:0}
@media (orientation:portrait){.connect-picker-grid--pages{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr))}}

/* 1.2.31: shared opaque brand button; the legacy data token remains compatible. */
.gamefirst-launcher,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry {
  appearance: none !important; box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  gap: .28em !important; padding: .12em .55em .12em .12em !important; overflow: hidden !important; white-space: nowrap !important;
  border: 1px solid #000 !important; border-radius: .62em !important;
  background: #000 !important;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  box-shadow: none !important;
  color: #fff !important; text-shadow: none !important; cursor: pointer; vertical-align: middle; touch-action: manipulation;
  transition: filter .16s ease, transform .12s ease;
}
.gamefirst-launcher { width: var(--gamefirst-launcher-width, 200px); height: 48px; flex: none; font: 700 21px/1 'GAMEFIRST Display',sans-serif; letter-spacing: -.02em; }
.gamefirst-launcher img,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry img { width: 2em !important; height: 2em !important; flex: none !important; display: block; object-fit: cover; border-radius: 50%; margin: 0 !important; position: static !important; pointer-events: none; user-select: none; -webkit-user-drag: none; }
.gamefirst-launcher span,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry span { flex: none !important; min-width: 0; margin: 0 !important; position: static !important; font-family: 'GAMEFIRST Display',sans-serif !important; background: linear-gradient(115deg,#fff 20%,#b8dfff 48%,#c1a0ff 72%,#fff); background-clip: text; -webkit-text-fill-color: transparent; color: #fff !important; text-shadow: none !important; white-space: nowrap !important; pointer-events: none; }
.gamefirst-launcher.gamefirst-mark-only,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry.gamefirst-mark-only { padding: .25em !important; gap: 0 !important; }
.gamefirst-launcher.gamefirst-mark-only span,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry.gamefirst-mark-only span { display: none !important; }
.gamefirst-launcher:focus-visible,
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry:focus-visible { outline: 2px solid #4a7dff !important; outline-offset: 3px; }
@media (hover: hover) { .gamefirst-launcher:hover:not(:disabled), html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry:hover:not(:disabled) { filter: brightness(1.04); } }
.gamefirst-launcher:active:not(:disabled),
html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry:active:not(:disabled) { transform: scale(.97); }
.gamefirst-launcher:disabled { opacity: .4; cursor: default; }
@media (prefers-reduced-motion: reduce) { .gamefirst-launcher, html[data-gamefirst-button=light] body .gamefirst-entry.gamefirst-entry { transition: none; } }
/* 1.2.19: the article is centred so the iPhone camera cutout on either landscape side never covers the start of the text. */
.connect-article .connect-meta,.connect-article .connect-fallback,.connect-article h1,.connect-copy{text-align:center}

/* Platform controls share the existing buttons and keep every feed in one stream. */
.connect-platforms{grid-column:1/-1;grid-row:3;display:flex;justify-content:center;gap:clamp(6px,1vw,18px);min-width:0}
.connect-platforms .gamefirst-control{min-width:0;min-height:40px;flex:0 1 auto;max-width:100%;padding:4px 12px;font-size:clamp(12px,1.45vmin,22px);white-space:normal}
.connect-platforms .gamefirst-control[aria-pressed=true]{outline:2px solid var(--connect-accent);outline-offset:-2px}
@media(max-width:639px){.connect-platforms{grid-row:5}}
.connect-leave{box-sizing:border-box}
.connect-leave .gamefirst-control{width:clamp(130px,24vw,400px);max-width:calc(50% - 8px);white-space:normal;overflow-wrap:anywhere}

/* Reading state is a blue UI indicator; registered project art remains unchanged. */
.connect-has-indicator{position:relative}
.connect-unread-dot{position:absolute;top:8%;right:7%;width:clamp(8px,1.2vmin,20px);aspect-ratio:1;border-radius:50%;background:#268cff;box-shadow:0 0 0 2px #0d0d0d;pointer-events:none}
.connect-unread-dot[hidden]{display:none!important}
.connect-installed{display:block;width:max-content;max-width:100%;margin:.45em auto 0;padding:.25em .65em;border:1px solid var(--connect-accent);border-radius:999px;color:var(--connect-accent);font:700 .46em/1.3 Arial,sans-serif;letter-spacing:0}
.connect-destination{flex-basis:100%;display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2vmin,32px);color:var(--connect-paper);text-align:center;font-size:clamp(22px,3.2vmin,70px)}
.connect-destination img{width:clamp(80px,16vmin,300px);aspect-ratio:1;object-fit:contain;border-radius:18%;pointer-events:none;-webkit-user-drag:none}
.connect-destination strong{max-width:min(90%,28em);overflow-wrap:anywhere}
.connect-leave h2{margin:.7em 0 0}
.connect-leave p{margin:0 0 .7em}

.connect-installed-summary{grid-column:1/-1;grid-row:4;margin:0;text-align:center;font-size:clamp(14px,1.9vmin,34px);color:var(--connect-accent)}
@media(max-width:639px){.connect-installed-summary{grid-row:6}}

/* A fixed native store is metadata, so it does not take a button-sized row. */
.connect-platforms--label{line-height:1.2}
.connect-platform-label{color:var(--connect-muted);font:400 clamp(11px,1.4vmin,20px)/1.2 Arial,sans-serif;text-align:center}

/* Website platform filters share the tabs row; embedded games reserve it for text. */
.connect-tabs{align-items:center;flex-wrap:wrap;column-gap:clamp(12px,2vw,32px);row-gap:4px}
.connect-tabs > .connect-platforms{margin-left:auto;justify-content:flex-end;flex-wrap:wrap;gap:clamp(4px,.6vw,10px);padding-block:4px}
.connect-tabs .connect-platforms .gamefirst-control{flex:0 0 auto;min-height:36px;padding:5px 9px;border-radius:12px;background:var(--connect-surface);color:var(--connect-paper);font-size:clamp(11px,1.45vmin,22px);box-shadow:none}
.connect-installed-summary{grid-row:3}
@media(max-width:639px){.connect-installed-summary{grid-row:5}.connect-tabs > .connect-platforms{width:100%;justify-content:center}}