/* ==========================================================================
   AI Game Atlas — the four lairs (Games · Rankings · Assets · News)
   Per-lair worlds: tokens, hero, telegraph layer, search seal.
   Content sections for each lair follow below the hero block.
   ========================================================================== */

/* ---------- Lair tokens ---------- */
.aga-lair--valdes, body.aga-l-games {
	--acc: #e0303f; --acc-2: #f0c27a; --acc-deep: #5a0812; --ink: #f3e9dc; --mist: #b9a59f; --ground: #0e0507;
	--title-grad: linear-gradient(180deg, #fff3e0 0%, #f2c98a 34%, #b23a2a 56%, #5a0b10 63%, #e9b07a 82%, #fff2da 100%);
	--title-glow: rgba(224, 48, 63, .38);
}
.aga-lair--sigma, body.aga-l-rankings {
	--acc: #5ff0ff; --acc-2: #bfe9ff; --acc-deep: #063244; --ink: #e3f4f6; --mist: #8fb3bb; --ground: #03090d;
	--title-grad: linear-gradient(180deg, #ffffff 0%, #d4fbff 36%, #3fb8d4 56%, #0b3a4c 63%, #9fe8f5 84%, #effeff 100%);
	--title-glow: rgba(95, 240, 255, .32);
}
.aga-lair--ophion, body.aga-l-assets {
	--acc: #c9a24c; --acc-2: #f2dc9a; --acc-deep: #3a2a0c; --ink: #141210; --mist: #5a554c; --ground: #f4f3ef;
	--title-grad: linear-gradient(180deg, #2a2620 0%, #0a0908 42%, #6b5220 58%, #0b0a09 70%, #3c3527 100%);
	--title-glow: rgba(201, 162, 76, .28);
}
.aga-lair--ariel, body.aga-l-news {
	--acc: #e3b766; --acc-2: #fff0cf; --acc-deep: #3b2a12; --ink: #f6efe2; --mist: #b1a8bb; --ground: #05040a;
	--title-grad: linear-gradient(180deg, #fffaf0 0%, #f5dfaa 34%, #b8873e 55%, #4b3214 62%, #f1d49a 82%, #fffaf0 100%);
	--title-glow: rgba(227, 183, 102, .35);
}

/* ---------- Hero geometry ---------- */
.aga-hero--lair { min-height: 600px; min-height: max(600px, 92svh); background: var(--ground); }
.aga-hero--lair .aga-hero__title {
	
	background: var(--title-grad); -webkit-background-clip: text; background-clip: text;
	filter: drop-shadow(0 2px 0 rgba(0, 0, 0, .55)) drop-shadow(0 0 26px var(--title-glow));
}
.aga-hero--lair .aga-hero__realm { color: var(--acc-2); }
.aga-hero--lair .aga-hero__realm::before { background: linear-gradient(90deg, transparent, var(--acc-2)); }
.aga-hero--lair .aga-hero__lede { color: color-mix(in srgb, var(--ink) 90%, transparent); }
.aga-hero--lair .aga-hero__copy { margin-bottom: clamp(64px, 11vh, 132px); }
.aga-hero--lair .aga-hero__shade {
	background:
		radial-gradient(75% 65% at 8% 100%, color-mix(in srgb, var(--ground) 92%, transparent), transparent 70%),
		linear-gradient(180deg, transparent 58%, var(--ground) 100%);
}
.aga-lair--valdes .aga-hero__poster img { object-position: 54% 30%; }
.aga-lair--sigma .aga-hero__poster img { object-position: 50% 26%; }
.aga-lair--ophion .aga-hero__poster img { object-position: 50% 22%; }
.aga-lair--ariel .aga-hero__poster img { object-position: 50% 28%; }

/* Ophion's white void: the one light hero. Text turns to ink. */
.aga-lair--ophion .aga-hero__lede { text-shadow: 0 1px 14px rgba(255, 255, 255, .9); }
.aga-lair--ophion .aga-hero__realm { color: #7a5d1f; }
.aga-lair--ophion .aga-hero__hint { color: rgba(20, 18, 16, .7); }
.aga-lair--ophion .aga-boss__name { color: #0e0d0b; text-shadow: 0 1px 12px #fff, 0 0 30px rgba(201, 162, 76, .5); }
.aga-lair--ophion .aga-boss__meta, .aga-lair--ophion .aga-boss__gate { color: #3d3830; }
.aga-lair--ophion .aga-fx__line { color: #3d3830; text-shadow: 0 1px 8px #fff; }
.aga-lair--ophion .aga-fx__skill { color: #1a1206; text-shadow: 0 0 22px rgba(201, 162, 76, .9), 0 2px 8px #fff; }
.aga-lair--ophion .aga-hero__scroll { border-color: rgba(60, 50, 30, .5); }
.aga-lair--ophion .aga-hero__scroll i { background: #3c3527; }

/* Boss name glow per lair */
.aga-hero--lair .aga-boss__name { text-shadow: 0 2px 10px #000, 0 0 30px var(--title-glow); }
.aga-hero--lair .aga-boss__epithet, .aga-hero--lair [data-boss-phase] { color: var(--acc-2); }
.aga-hero--lair .aga-fx__skill { text-shadow: 0 0 22px var(--acc), 0 2px 8px #000; }
.aga-lair--sigma .aga-fx__skill { color: #e9feff; }
.aga-lair--ariel .aga-fx__skill { color: #fff4dc; }
.aga-hero--lair .aga-fx__callout { top: calc(var(--hdr) + 128px); }
.aga-hero--lair .aga-fx__skill { font-size: clamp(1.35rem, 2.6vw, 2.1rem); animation: none; }
.aga-hero--lair .aga-fx__callout.is-on .aga-fx__skill { animation: aga-callout .5s var(--ease-out); }
@keyframes aga-callout { from { letter-spacing: .28em; opacity: 0; filter: blur(6px); } }

/* Telegraph canvas */
.aga-tele2d { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.aga-hero--lair .aga-fx { z-index: 3; }

/* Ultimate rune: a small dial between phase and HP that fills as the ultimate nears */
.aga-boss__ult { position: relative; width: 22px; height: 22px; border-radius: 50%; margin-top: -5px;
	background: conic-gradient(var(--acc) calc(var(--v, 0) * 360deg), rgba(255, 255, 255, .1) 0); box-shadow: 0 0 0 1px rgba(0, 0, 0, .7); }
.aga-boss__ult i { position: absolute; inset: 4px; border-radius: 50%; background: #0b0710; }
.aga-boss__ult i::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--acc); opacity: calc(var(--v, 0) * .9); }
.aga-boss__ult.is-on { animation: aga-ult 0.25s steps(2) infinite; box-shadow: 0 0 18px var(--acc); }
.aga-boss__meta { align-items: center; }
@keyframes aga-ult { 50% { filter: brightness(2.2); } }

/* ---------- Search seal (Games / Assets) ---------- */
.aga-seek {
	position: relative; display: flex; align-items: center; gap: 0; width: min(34rem, 88vw);
	height: 58px; padding: 0 6px 0 50px;
	background: color-mix(in srgb, var(--ground) 72%, transparent);
	border: 1px solid color-mix(in srgb, var(--acc-2) 55%, transparent);
	clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	transition: border-color .3s, box-shadow .3s;
}
.aga-seek:focus-within { border-color: var(--acc-2); box-shadow: inset 0 0 0 1px var(--acc-2), 0 0 40px var(--title-glow); }
.aga-seek__glass { position: absolute; left: 16px; width: 22px; height: 22px; color: var(--acc-2); transition: transform .6s var(--ease-out); }
.aga-seek:focus-within .aga-seek__glass { transform: rotate(-90deg) scale(1.08); }
.aga-seek input[type="search"] {
	flex: 1; min-width: 0; height: 100%; border: 0 !important; background: transparent !important; box-shadow: none !important;
	color: var(--ink) !important; font: 500 1.05rem var(--f-ui); padding: 0 10px !important; outline: none;
}
.aga-seek input::placeholder { color: color-mix(in srgb, var(--ink) 55%, transparent); font-style: italic; font-family: var(--f-serif); font-size: 1.12rem; }
.aga-seek__go {
	flex: none; height: 44px; padding: 0 20px; border: 0; cursor: pointer;
	font: 700 .95rem/1 var(--f-ui); letter-spacing: .04em; color: #fff7e8;
	background: linear-gradient(180deg, color-mix(in srgb, var(--acc) 85%, #fff), var(--acc-deep));
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
	transition: filter .3s, transform .3s var(--ease-out);
}
.aga-seek__go:hover { filter: brightness(1.18); transform: translateY(-1px); }
.aga-lair--ophion .aga-seek { background: rgba(255, 255, 255, .7); }
.aga-lair--ophion .aga-seek__go { color: #fff; background: linear-gradient(180deg, #2a2620, #0b0a09); }
.aga-lair--sigma .aga-btn--primary::before { background: linear-gradient(180deg, #0f6178, #06303f 70%, #031820); }
.aga-lair--ariel .aga-btn--primary::before { background: linear-gradient(180deg, #6d4a1c, #31200b 70%, #170e04); }

@media (max-width: 767px) {
	.aga-hero--lair { height: 86svh; min-height: 560px; }
	.aga-hero--lair .aga-hero__title { font-size: clamp(2.4rem, 11vw, 3.2rem) !important; }
		.aga-hero--lair .aga-hero__copy { margin-bottom: 84px; }
		body.aga-adv-on .aga-hero--lair .aga-hero__copy { margin-bottom: 96px; }
	.aga-hero--lair .aga-fx__callout { top: calc(var(--hdr) + 92px); }
	.aga-seek { height: 52px; }
	.aga-seek__go { padding: 0 14px; }
	.aga-boss__ult { width: 16px; height: 16px; }
}

/* ==========================================================================
   Content below the bosses
   ========================================================================== */
body.aga-lairpage .site.grid-container, body.aga-bleed .site.grid-container,
body.aga-bleed .site-content, body.aga-bleed #page { max-width: none; padding: 0; margin: 0; display: block; }
body.aga-l-games { --page: #0d0507; --card: #170a0d; --line: rgba(240, 194, 122, .18); }
body.aga-l-rankings { --page: #03090d; --card: #071820; --line: rgba(95, 240, 255, .16); }
body.aga-l-news { --page: #06050b; --card: #110e18; --line: rgba(227, 183, 102, .18); }
body.aga-l-assets { --page: #f1f0ec; --card: #ffffff; --line: rgba(20, 18, 16, .12); }
body.aga-bleed { background: var(--page, var(--void)); }
.aga-main { color: var(--ink, var(--bone)); }

.aga-wrap { max-width: 1240px; margin: 0 auto; padding-left: clamp(18px, 4vw, 48px); padding-right: clamp(18px, 4vw, 48px); }
.aga-wrap--read { max-width: 820px; }
.aga-main .aga-h2 { margin: 0 0 14px; font: 600 clamp(1.9rem, 3.6vw, 2.9rem)/1.05 var(--f-serif) !important; color: var(--ink, var(--bone)); letter-spacing: -.005em; }
.aga-main .aga-h3 { margin: 2rem 0 .7rem; font: 600 1.5rem/1.15 var(--f-serif) !important; color: var(--ink, var(--bone)); }
.aga-main .aga-answer { margin: 0 0 12px; max-width: 46rem; font-size: clamp(1.06rem, 1.4vw, 1.2rem); line-height: 1.62; color: color-mix(in srgb, var(--ink, #ece3d4) 88%, transparent); }
.aga-link { color: var(--acc-2) !important; font-weight: 500; }
body.aga-l-assets .aga-link { color: #6b4f16 !important; }
.aga-ic { width: 1.05em; height: 1.05em; margin-right: .5em; vertical-align: -.15em; }
.aga-btn--sm { min-height: 42px; padding: 0 18px; font-size: .92rem; }
body.aga-l-assets .aga-btn--ghost { color: #3c2d10 !important; background: rgba(60, 45, 16, .45); }
body.aga-l-assets .aga-btn--ghost::before { background: #fff; }

/* Breadcrumbs */
.aga-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0 0 22px; padding: 0; list-style: none; font: italic 500 .98rem/1.3 var(--f-serif); color: var(--mist); }
.aga-crumbs li + li::before { content: ""; display: inline-block; width: 18px; height: 1px; margin: 0 8px; vertical-align: middle; background: currentColor; opacity: .5; }
.aga-crumbs a { color: var(--mist) !important; text-decoration: none; }
.aga-crumbs a:hover { color: var(--acc-2) !important; }

/* ---------- Database head + filters ---------- */
.aga-db, .aga-lib, .aga-boards, .aga-chron { padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(36px, 5vw, 64px); }
.aga-db__head { margin-bottom: 26px; }
.aga-filters { position: relative; margin: 0 0 22px; }
.aga-filters__bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.aga-filters__q { position: relative; flex: 1 1 280px; display: flex; align-items: center; }
.aga-filters__q svg { position: absolute; left: 14px; width: 18px; height: 18px; color: var(--acc-2); }
.aga-filters input[type="search"], .aga-filters select {
	width: 100%; height: 46px; padding: 0 14px 0 42px !important; border: 1px solid var(--line) !important; border-radius: 0 !important;
	background: var(--card) !important; color: var(--ink) !important; font: 500 1rem var(--f-ui) !important; box-shadow: none !important;
}
.aga-filters select { padding-left: 12px !important; width: auto; min-width: 190px; cursor: pointer; }
.aga-filters input:focus, .aga-filters select:focus { border-color: var(--acc-2) !important; outline: none; }
.aga-filters__sort { display: flex; align-items: center; gap: 8px; font: italic 500 1rem var(--f-serif); color: var(--mist); }
.aga-filters__open { display: none; }
.aga-sheet__inner { display: grid; gap: 14px; }
.aga-chipset { margin: 0; padding: 0; border: 0; min-width: 0; }
.aga-chipset legend { float: left; width: 110px; padding: 6px 0 0; font: italic 600 1.02rem var(--f-serif); color: var(--acc-2); }
body.aga-l-assets .aga-chipset legend { color: #6b4f16; }
.aga-chipset__list { display: flex; flex-wrap: wrap; gap: 6px; margin-left: 110px; }
.aga-chip { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--line); background: color-mix(in srgb, var(--card) 80%, transparent); cursor: pointer; font-size: .9rem; line-height: 1.2; color: var(--ink); transition: border-color .25s, background .25s, transform .25s var(--ease-out); user-select: none; }
.aga-chip input { position: absolute; opacity: 0; pointer-events: none; }
.aga-chip small { font-size: .74rem; color: var(--mist); font-variant-numeric: tabular-nums; }
.aga-chip:hover { border-color: color-mix(in srgb, var(--acc-2) 60%, transparent); transform: translateY(-1px); }
.aga-chip:has(input:checked) { border-color: var(--acc); background: color-mix(in srgb, var(--acc) 22%, var(--card)); box-shadow: inset 0 0 0 1px var(--acc); }
.aga-chip:has(input:focus-visible) { outline: 2px solid var(--acc-2); outline-offset: 2px; }
.aga-chip--g::before { content: ""; width: 7px; height: 7px; transform: rotate(45deg); background: hsl(var(--gh, 40) 70% 60%); }
.aga-sheet__actions { display: none; }
.aga-results { transition: opacity .25s; }
.aga-results.is-loading { opacity: .45; pointer-events: none; }
.aga-results__count { margin: 0 0 14px; font: italic 500 1.05rem var(--f-serif); color: var(--mist); }

/* ---------- Game cards ---------- */
.aga-ggrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 18px; }
.aga-ggrid--4 { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.aga-gcard { position: relative; display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); transition: transform .45s var(--ease-out), border-color .3s, box-shadow .45s; }
.aga-gcard:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--acc-2) 45%, transparent); box-shadow: 0 22px 50px rgba(0, 0, 0, .45); }
.aga-gcard__art { position: relative; display: block; aspect-ratio: 16 / 8; overflow: hidden; background: #000; }
.aga-gcard__art img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.aga-gcard:hover .aga-gcard__art img, .aga-gcard:hover .aga-plate b { transform: scale(1.06); }
.aga-gcard__body { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px 18px; flex: 1; }
.aga-gcard__by { margin: 0; font: italic 500 .98rem/1.2 var(--f-serif); color: var(--mist); }
.aga-gcard__sum { margin: 0; font-size: .95rem; line-height: 1.5; color: color-mix(in srgb, var(--ink) 82%, transparent); }
.aga-gcard__foot { display: flex; align-items: center; gap: 8px; margin: auto 0 0; padding-top: 10px; border-top: 1px solid var(--line); font-size: .85rem; color: var(--mist); }
.aga-gcard__num { font-weight: 700; color: var(--ink); }
.aga-gcard__unrated { font-style: italic; }
.aga-gcard__plat { margin-left: auto; text-align: right; }

/* generated cover plate */
.aga-plate { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden;
	background:
		radial-gradient(120% 90% at 20% 0%, hsl(var(--h) 70% 34% / .9), transparent 60%),
		radial-gradient(80% 120% at 100% 100%, hsl(calc(var(--h) + 40) 60% 22%), transparent 70%),
		repeating-linear-gradient(135deg, hsl(var(--h) 30% 12%) 0 2px, hsl(var(--h) 30% 9%) 2px 9px); }
.aga-plate::after { content: ""; position: absolute; inset: 10px; border: 1px solid hsl(var(--h) 60% 70% / .28); }
.aga-plate b { font: 700 clamp(3rem, 7vw, 5.5rem)/1 var(--f-display); color: hsl(var(--h) 80% 86% / .9); text-shadow: 0 0 40px hsl(var(--h) 90% 60% / .6); transition: transform 1.2s var(--ease-out); }

/* chips (AI features) */
.aga-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.aga-chips li { padding: 3px 9px; font-size: .78rem; line-height: 1.3; color: var(--acc-2); border: 1px solid color-mix(in srgb, var(--acc-2) 32%, transparent); background: color-mix(in srgb, var(--acc) 8%, transparent); }
.aga-chips li.is-more { color: var(--mist); }
.aga-chips--lg li { font-size: .95rem; padding: 6px 12px; }
.aga-chips a { color: inherit !important; text-decoration: none; }
body.aga-l-assets .aga-chips li { color: #6b4f16; }

/* stars */
.aga-stars { position: relative; display: inline-block; width: 80px; height: 15px; background: rgba(255, 255, 255, .14);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 15'%3E%3Cg%3E%3Cpath id='s' d='M7.5 0l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4L3 13.8l.9-5L.3 5.3l5-.7z'/%3E%3Cuse href='%23s' x='16'/%3E%3Cuse href='%23s' x='32'/%3E%3Cuse href='%23s' x='48'/%3E%3Cuse href='%23s' x='64'/%3E%3C/g%3E%3C/svg%3E") center / 100% 100%;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 15'%3E%3Cg%3E%3Cpath id='s' d='M7.5 0l2.2 4.6 5 .7-3.6 3.5.9 5-4.5-2.4L3 13.8l.9-5L.3 5.3l5-.7z'/%3E%3Cuse href='%23s' x='16'/%3E%3Cuse href='%23s' x='32'/%3E%3Cuse href='%23s' x='48'/%3E%3Cuse href='%23s' x='64'/%3E%3C/g%3E%3C/svg%3E") center / 100% 100%; }
.aga-stars i { position: absolute; inset: 0 auto 0 0; width: var(--p); background: linear-gradient(180deg, #ffe7a8, var(--acc-2), #b88a3a); }

/* pagination + empty */
.aga-pages ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 34px 0 0; padding: 0; list-style: none; }
.aga-pages a, .aga-pages span { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; font-variant-numeric: tabular-nums; }
.aga-pages .current { border-color: var(--acc); background: color-mix(in srgb, var(--acc) 20%, transparent); }
.aga-pages a:hover { border-color: var(--acc-2); }
.aga-empty { padding: 44px 24px; text-align: center; border: 1px dashed var(--line); }
.aga-empty__t { margin: 0 0 6px; font: italic 600 1.45rem/1.2 var(--f-serif); color: var(--ink); }
.aga-empty p:last-child { margin: 0; color: var(--mist); }

/* ---------- Genre name plates v3 ----------
   Layers: plate (unclipped: focus ring, drips, tails and cones may step outside) · ::before frame ornament ·
   ::after exterior accent · __fx clipped interior (+ ::before, ::after, five <b>) · __sig sigil · __t title.
   Spacing: padding = --pad-* (set by context) + --slot-* (reserved by the genre for its widget) — never both on padding.
   Type: --gn-size × --gn-scale in --gn-font / --gn-weight, so a genre can change face without fighting context sizes.
   Motion: one story per genre on .is-lit (scroll-in / hover, aga-atlas.js) and keyboard focus; quiet at rest. */
@property --zr { syntax: "<length>"; inherits: false; initial-value: 30em; }
@property --rv { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --front { syntax: "<percentage>"; inherits: true; initial-value: 44%; }
@property --inkf { syntax: "<number>"; inherits: true; initial-value: 1; }
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@property --lx { syntax: "<percentage>"; inherits: true; initial-value: 70%; }
@property --hp { syntax: "<percentage>"; inherits: true; initial-value: 100%; }
@property --hplag { syntax: "<percentage>"; inherits: true; initial-value: 100%; }
.aga-gname { --gh: 42; --a1: hsl(var(--gh) 82% 64%); --a2: var(--gilt-hi, #f6dfa4);
	--gn-size: 1.32rem; --gn-scale: 1; --gn-font: var(--f-display); --gn-weight: 700; --gn-track: .02em;
	--pad-y: .22em; --pad-l: .5em; --pad-r: .66em; --slot-t: 0em; --slot-r: 0em; --slot-b: 0em; --below: 0em; --tk: 6px; --r: 2px;
	position: relative; display: inline-flex; align-items: center; max-width: 100%; margin: 0 0 var(--below) !important;
	padding: calc(var(--pad-y) + var(--slot-t)) calc(var(--pad-r) + var(--slot-r)) calc(var(--pad-y) + var(--slot-b)) var(--pad-l);
	isolation: isolate; border-radius: var(--r);
	font: var(--gn-weight) calc(var(--gn-size) * var(--gn-scale)) / 1.12 var(--gn-font) !important; letter-spacing: var(--gn-track);
	color: var(--gn-ink, var(--ink, #ece3d4)) !important;
	background: var(--plate, linear-gradient(180deg, hsl(var(--gh) 38% 14% / .94), hsl(var(--gh) 42% 7% / .94)));
	border: 1px solid var(--edge, color-mix(in srgb, var(--a1) 42%, transparent));
	box-shadow: var(--plate-shadow, inset 0 1px 0 rgba(255, 255, 255, .06), 0 1px 0 rgba(0, 0, 0, .5));
	transition: border-color .4s, box-shadow .4s; }
.aga-gname > a { display: inline-flex; align-items: center; color: inherit !important; text-decoration: none; }
.aga-gname a::after { content: ""; position: absolute; inset: 0; z-index: 6; }
.aga-gname a:focus-visible { outline: none; }
.aga-gname:has(a:focus-visible) { outline: 2px solid var(--a1); outline-offset: 4px; }
.aga-gname::before, .aga-gname::after { content: ""; position: absolute; pointer-events: none; }
.aga-gname::before { inset: 3px; z-index: 4; opacity: .8; --c: linear-gradient(var(--gilt, #d5a95a), var(--gilt, #d5a95a));
	background: var(--c) left top / var(--tk) 1px no-repeat, var(--c) left top / 1px var(--tk) no-repeat, var(--c) right top / var(--tk) 1px no-repeat, var(--c) right top / 1px var(--tk) no-repeat,
		var(--c) left bottom / var(--tk) 1px no-repeat, var(--c) left bottom / 1px var(--tk) no-repeat, var(--c) right bottom / var(--tk) 1px no-repeat, var(--c) right bottom / 1px var(--tk) no-repeat; }
.aga-gname::after { z-index: 4; }
.aga-gname__sig { position: relative; z-index: 3; flex: none; width: .86em; height: .86em; margin-right: .42em; transform-origin: 50% 50%;
	background: var(--sig-paint, linear-gradient(140deg, var(--gilt-hi, #f6dfa4) 10%, var(--a1) 80%)); -webkit-mask: var(--sig) center / contain no-repeat; mask: var(--sig) center / contain no-repeat; }
.aga-gname__t { position: relative; z-index: 3; display: inline-block; transform-origin: 50% 90%; }
.aga-gname__fx { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: inherit; pointer-events: none; }
.aga-gname__fx::before, .aga-gname__fx::after { content: ""; position: absolute; }
.aga-gname__fx b { position: absolute; display: block; }
.aga-gname__fx b::before, .aga-gname__fx b::after { content: ""; position: absolute; }
.aga-gname:hover, .aga-gcard:hover .aga-gname { border-color: color-mix(in srgb, var(--a1) 75%, transparent); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 0 22px color-mix(in srgb, var(--a1) 24%, transparent); }
.aga-gcard .aga-gname { align-self: flex-start; }
/* list rows (rankings, sidebar): plate + sigil only */
span.aga-gname { --tk: 4px; --pad-y: .12em; --pad-l: .38em; --pad-r: .5em; --slot-t: 0em !important; --slot-r: 0em !important; --slot-b: 0em !important; --below: 0em !important; }
span.aga-gname::before { inset: 2px; }
span.aga-gname .aga-gname__fx, span.aga-gname::after { display: none; }
body.aga-l-assets .aga-gname { --gn-ink: #141210; --plate: linear-gradient(180deg, hsl(var(--gh) 40% 96%), hsl(var(--gh) 35% 90%)); }

.aga-gname { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3l9 9-9 9-9-9z'/%3E%3Ccircle cx='12' cy='12' r='2.2'/%3E%3C/svg%3E"); }
.aga-gname[data-g="fps"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='7'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 2v5M12 17v5M2 12h5M17 12h5'/%3E%3Ccircle cx='12' cy='12' r='1.6'/%3E%3C/svg%3E"); }
.aga-gname[data-g="shooter"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8.5h4.5a3.5 3.5 0 0 1 0 7H12z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 10h6M5 14h4M10 8.5v7'/%3E%3C/svg%3E"); }
.aga-gname[data-g="battle-royale"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='9.5' stroke-dasharray='3 3'/%3E%3Cpath fill-rule='evenodd' d='M12 6.5a3.6 3.6 0 0 1 3.6 3.6c0 2.7-3.6 6.4-3.6 6.4s-3.6-3.7-3.6-6.4A3.6 3.6 0 0 1 12 6.5zm0 2.4a1.2 1.2 0 1 0 0 2.4 1.2 1.2 0 0 0 0-2.4z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="action"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='M20.5 3.5 9.5 14.5'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M7 12l5 5M8.5 15.5l-4 4'/%3E%3Ccircle cx='4' cy='20' r='1.4'/%3E%3C/svg%3E"); }
.aga-gname[data-g="rpg"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 2.8l7.5 3v5.4c0 4.9-3.3 8.3-7.5 10-4.2-1.7-7.5-5.1-7.5-10V5.8z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 7.5v9M9.2 10.2 12 12.6l2.8-2.4'/%3E%3C/svg%3E"); }
.aga-gname[data-g="adventure"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='9'/%3E%3Cpath d='M12 5.2l2.4 6.8-2.4 6.8-2.4-6.8z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="strategy"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6.5 20.5h11M8 20.5l1.2-8.5h5.6l1.2 8.5M8.2 12V6.2h2.1v2.2h1.1V6.2h1.2v2.2h1.1V6.2h2.1V12'/%3E%3C/svg%3E"); }
.aga-gname[data-g="simulation"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='3'/%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='7'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 2v3M12 19v3M2 12h3M19 12h3M4.9 4.9 7 7M17 17l2.1 2.1M4.9 19.1 7 17M17 7l2.1-2.1'/%3E%3C/svg%3E"); }
.aga-gname[data-g="life-sim"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 18h18M6.5 18a5.5 5.5 0 0 1 11 0M12 6.5v2.2M5.6 9.6l1.6 1.6M18.4 9.6l-1.6 1.6'/%3E%3C/svg%3E"); }
.aga-gname[data-g="sandbox"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 2.8l8 4.6v9.2L12 21.2l-8-4.6V7.4zM12 12l8-4.6M12 12v9.2M12 12 4 7.4'/%3E%3C/svg%3E"); }
.aga-gname[data-g="puzzle"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 8.5h3.6a2.2 2.2 0 1 1 4.3 0H17v3.6a2.2 2.2 0 1 1 0 4.3V20H5v-3.6a2.2 2.2 0 1 0 0-4.3z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="horror"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='2.8'/%3E%3C/svg%3E"); }
.aga-gname[data-g="interactive-fiction"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 3.5C14 4.5 9 9.5 7 16.5l-1 3.5 3.5-1c7-2 11.5-7 12-13M6.5 18.5l6.5-6.5'/%3E%3C/svg%3E"); }
.aga-gname[data-g="text-adventure"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 7l5 5-5 5M12 18h8'/%3E%3C/svg%3E"); }
.aga-gname[data-g="visual-novel"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 4.5h16v11.5h-9.5L6 20.2V16H4z'/%3E%3Ccircle cx='8.8' cy='10.3' r='1.1'/%3E%3Ccircle cx='12' cy='10.3' r='1.1'/%3E%3Ccircle cx='15.2' cy='10.3' r='1.1'/%3E%3C/svg%3E"); }
.aga-gname[data-g="mystery"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='10.5' cy='10.5' r='6'/%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.6' d='M15 15l5.5 5.5'/%3E%3C/svg%3E"); }
.aga-gname[data-g="party"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 20.5 8 7.5l8.5 8.5z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M14 3.5v2.2M18.6 5.4 17 7M20.5 10h-2.2M11 4.5l1 1.6'/%3E%3C/svg%3E"); }
.aga-gname[data-g="sci-fi"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' rx='9.5' ry='3.6'/%3E%3Cellipse fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' rx='9.5' ry='3.6' transform='rotate(60 12 12)'/%3E%3Cellipse fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' rx='9.5' ry='3.6' transform='rotate(120 12 12)'/%3E%3Ccircle cx='12' cy='12' r='1.8'/%3E%3C/svg%3E"); }
.aga-gname[data-g="survival"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5c1 4 6.5 6.2 6.5 11.5a6.5 6.5 0 0 1-13 0c0-3.2 2-4.6 3.2-6.4.2 2.2 1.2 3.4 2.4 3.6-.4-3.4.2-6.2.9-8.7z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="racing"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3.4 10.6h6.4M14.2 10.6h6.4M12 14.6v6.2'/%3E%3C/svg%3E"); }
.aga-gname[data-g="mmo"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='6' cy='9' r='2.2'/%3E%3Ccircle cx='12' cy='7' r='2.5'/%3E%3Ccircle cx='18' cy='9' r='2.2'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 19c0-3 1.6-5 3.5-5s3.5 2 3.5 5M8.4 19.5c0-4 1.6-6.3 3.6-6.3s3.6 2.3 3.6 6.3M14.5 19c0-3 1.6-5 3.5-5s3.5 2 3.5 5'/%3E%3C/svg%3E"); }
.aga-gname[data-g="card"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' x='4' y='5' width='10' height='14' rx='1.8' transform='rotate(-12 9 12)'/%3E%3Crect fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' x='10' y='5' width='10' height='14' rx='1.8' transform='rotate(10 15 12)'/%3E%3C/svg%3E"); }
.aga-gname[data-g="comedy"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='9'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M7.6 14c1.6 2.4 7.2 2.4 8.8 0M7.4 10c.8-1.1 2.2-1.1 3 0M13.6 10c.8-1.1 2.2-1.1 3 0'/%3E%3C/svg%3E"); }
.aga-gname[data-g="dating-sim"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="social-deduction"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M2.5 9.2c3-1.4 6.4-1.4 9.5.7 3.1-2.1 6.5-2.1 9.5-.7 0 4.3-2.2 7.4-5.3 7.4-2 0-3.2-1.6-4.2-2.8-1 1.2-2.2 2.8-4.2 2.8-3.1 0-5.3-3.1-5.3-7.4zM8 11a1.6 1.6 0 1 0 0 3.2A1.6 1.6 0 0 0 8 11zm8 0a1.6 1.6 0 1 0 0 3.2A1.6 1.6 0 0 0 16 11z'/%3E%3C/svg%3E"); }
.aga-gname[data-g="open-world"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M1.8 19.5 8 10.2l3.9 5 3.1-4.2 7.2 8.5z'/%3E%3Ccircle cx='17.3' cy='6' r='2'/%3E%3C/svg%3E"); }
.aga-gname[data-g="casual"] { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='9.5' cy='13.5' r='6'/%3E%3Ccircle fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='17.5' cy='6.5' r='3'/%3E%3Ccircle cx='19.5' cy='13.5' r='1.5'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M7 11a3 3 0 0 1 2.5-1.5'/%3E%3C/svg%3E"); }
.aga-gname[data-g="fps"] { --a1: #ff4b3e; --a2: #ffc46b; --slot-b: .3em; --plate: linear-gradient(180deg, #1c0f10, #0d0708); --edge: rgba(255, 75, 62, .34); }
.aga-gname[data-g="fps"]::before { inset: -5px; opacity: .5; background: linear-gradient(135deg, var(--a2), var(--a1)); -webkit-mask: linear-gradient(#000 0 0) left top / 10px 2px no-repeat, linear-gradient(#000 0 0) left top / 2px 10px no-repeat, linear-gradient(#000 0 0) right top / 10px 2px no-repeat, linear-gradient(#000 0 0) right top / 2px 10px no-repeat, linear-gradient(#000 0 0) left bottom / 10px 2px no-repeat, linear-gradient(#000 0 0) left bottom / 2px 10px no-repeat, linear-gradient(#000 0 0) right bottom / 10px 2px no-repeat, linear-gradient(#000 0 0) right bottom / 2px 10px no-repeat; mask: linear-gradient(#000 0 0) left top / 10px 2px no-repeat, linear-gradient(#000 0 0) left top / 2px 10px no-repeat, linear-gradient(#000 0 0) right top / 10px 2px no-repeat, linear-gradient(#000 0 0) right top / 2px 10px no-repeat, linear-gradient(#000 0 0) left bottom / 10px 2px no-repeat, linear-gradient(#000 0 0) left bottom / 2px 10px no-repeat, linear-gradient(#000 0 0) right bottom / 10px 2px no-repeat, linear-gradient(#000 0 0) right bottom / 2px 10px no-repeat; }
.aga-gname[data-g="fps"] .aga-gname__fx::before { left: .55em; right: .55em; bottom: .1em; height: .3em; opacity: .4; background: linear-gradient(90deg, var(--a1), var(--a2)); -webkit-mask: repeating-linear-gradient(90deg, #000 0 1px, transparent 1px 6px) 0 100% / 100% 45% no-repeat, repeating-linear-gradient(90deg, #000 0 1px, transparent 1px 30px) 0 100% / 100% 100% no-repeat, linear-gradient(#000 0 0) 0 100% / 100% 1px no-repeat; mask: repeating-linear-gradient(90deg, #000 0 1px, transparent 1px 6px) 0 100% / 100% 45% no-repeat, repeating-linear-gradient(90deg, #000 0 1px, transparent 1px 30px) 0 100% / 100% 100% no-repeat, linear-gradient(#000 0 0) 0 100% / 100% 1px no-repeat; }
.aga-gname[data-g="fps"] .aga-gname__fx b:nth-child(1) { left: .55em; bottom: .42em; width: .34em; height: .24em; margin-left: -.17em; background: var(--a2); clip-path: polygon(0 0, 100% 0, 50% 100%); opacity: 0; filter: drop-shadow(0 0 3px var(--a2)); }
.aga-gname[data-g="fps"] .aga-gname__fx b:nth-child(2) { left: .93em; top: 50%; width: 1.3em; height: 1.3em; margin: -.65em 0 0 -.65em; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--a1); opacity: 0; }
.aga-gname[data-g="fps"]:is(.is-lit, :has(a:focus-visible))::before { animation: gf-hud 1s cubic-bezier(.2,1.4,.35,1) both; }
.aga-gname[data-g="fps"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-ruler 1.1s ease-out both; }
.aga-gname[data-g="fps"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-marker 1.1s cubic-bezier(.3,.8,.25,1) both; }
.aga-gname[data-g="fps"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-ping 1.1s ease-out .45s both; }
.aga-gname[data-g="fps"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-reticle 1s cubic-bezier(.2,.8,.2,1) both; }
@keyframes gf-hud { 0% { inset: -16px; opacity: 0; } 45% { inset: -1px; opacity: 1; filter: drop-shadow(0 0 4px var(--a1)); } 62% { inset: -4px; } 100% { inset: -4px; opacity: 1; } }
@keyframes gf-ruler { 0% { opacity: .4; } 40% { opacity: 1; } 100% { opacity: .7; } }
@keyframes gf-marker { 0% { left: .55em; opacity: 0; } 12% { opacity: 1; } 70% { left: 74%; } 82% { left: 71%; } 100% { left: 72%; opacity: 1; } }
@keyframes gf-ping { 0% { transform: scale(.4); opacity: 0; } 20% { opacity: 1; } 100% { transform: scale(1.9); opacity: 0; } }
@keyframes gf-reticle { 0% { transform: rotate(-90deg) scale(.6); } 45% { transform: rotate(0) scale(1.22); filter: drop-shadow(0 0 5px var(--a1)); } 100% { transform: none; } }
.aga-gname[data-g="shooter"] { --a1: #ff8a3d; --a2: #fff1c2; --slot-r: 1.2em; --plate: linear-gradient(180deg, #1f120a, #100905); --edge: rgba(255, 138, 61, .34); }
.aga-gname[data-g="shooter"] .aga-gname__fx::after { right: .48em; top: 50%; width: .72em; height: .5em; margin-top: -.25em; opacity: .65; background: repeating-linear-gradient(90deg, var(--a2) 0 .08em, transparent .08em .145em); -webkit-mask: linear-gradient(180deg, transparent 0 14%, rgba(0,0,0,.6) 14% 30%, #000 30%); mask: linear-gradient(180deg, transparent 0 14%, rgba(0,0,0,.6) 14% 30%, #000 30%); }
.aga-gname[data-g="shooter"] .aga-gname__fx b:nth-child(1) { left: 1.3em; right: 0; bottom: .12em; height: 2px; background: linear-gradient(90deg, transparent, var(--a1) 75%, #fff) -50% 0 / 34% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 3px var(--a1)); }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-tracer .42s cubic-bezier(.3,.6,.5,1) 0s both; }
.aga-gname[data-g="shooter"] .aga-gname__fx b:nth-child(2) { left: 1.3em; right: 0; top: .12em; height: 2px; background: linear-gradient(90deg, transparent, var(--a1) 75%, #fff) -50% 0 / 34% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 3px var(--a1)); }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-tracer .42s cubic-bezier(.3,.6,.5,1) .16s both; }
.aga-gname[data-g="shooter"] .aga-gname__fx b:nth-child(3) { left: 1.3em; right: 0; bottom: .26em; height: 2px; background: linear-gradient(90deg, transparent, var(--a1) 75%, #fff) -50% 0 / 34% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 3px var(--a1)); }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-tracer .42s cubic-bezier(.3,.6,.5,1) .32s both; }
.aga-gname[data-g="shooter"] .aga-gname__fx b:nth-child(4) { left: 1.3em; top: 50%; width: 1.5em; height: 1.5em; margin: -.75em 0 0 -.75em; background: radial-gradient(circle, #fff 0 7%, var(--a2) 16%, rgba(255, 138, 61, .55) 32%, transparent 62%); opacity: 0; }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-flash3 .62s linear both; }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-ammo .62s steps(1, end) both; }
.aga-gname[data-g="shooter"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-recoil3 .62s ease-out both; }
@keyframes gf-tracer { 0% { background-position: -50% 0; opacity: 1; } 100% { background-position: 150% 0; opacity: 1; } }
@keyframes gf-flash3 { 0% { opacity: 1; transform: scale(.7); } 10% { opacity: 0; } 26% { opacity: 1; transform: scale(.9); } 36% { opacity: 0; } 52% { opacity: 1; transform: scale(.8); } 62%, 100% { opacity: 0; } }
@keyframes gf-ammo { 0% { width: .72em; } 26% { width: .575em; } 52% { width: .43em; } 78%, 100% { width: .29em; } }
@keyframes gf-recoil3 { 0%, 26%, 52% { transform: translateX(-.12em) rotate(-7deg); } 13%, 39%, 65%, 100% { transform: none; } }
.aga-gname[data-g="battle-royale"] { --a1: #ff9d47; --a2: #8fd0ff; --plate: linear-gradient(180deg, #1c130c, #0e0906); --edge: rgba(255, 157, 71, .34); }
.aga-gname[data-g="battle-royale"] .aga-gname__fx::before { inset: 0; opacity: .85; background: repeating-radial-gradient(circle at .95em 50%, transparent 0 .34em, rgba(143, 208, 255, .12) .34em calc(.34em + 1px)); }
.aga-gname[data-g="battle-royale"] .aga-gname__fx::after { --zr: 14em; inset: 0; opacity: 0; background: linear-gradient(115deg, #4a2fd6, #2f7dff 45%, #6b3cff 90%) 0 0 / 220% 100%; -webkit-mask: radial-gradient(circle at .95em 50%, transparent var(--zr), #000 calc(var(--zr) + .45em)); mask: radial-gradient(circle at .95em 50%, transparent var(--zr), #000 calc(var(--zr) + .45em)); }
.aga-gname[data-g="battle-royale"] .aga-gname__fx b:nth-child(1) { --zr: 14em; left: .95em; top: 50%; width: calc(var(--zr) * 2); height: calc(var(--zr) * 2); transform: translate(-50%, -50%); border-radius: 50%; border: 1.5px solid #cbe9ff; box-shadow: 0 0 10px #8fd0ff, inset 0 0 10px rgba(143, 208, 255, .6); opacity: 0; }
.aga-gname[data-g="battle-royale"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-storm 1.7s cubic-bezier(.5,0,.3,1) both; }
.aga-gname[data-g="battle-royale"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-zonering 1.7s cubic-bezier(.5,0,.3,1) both; }
.aga-gname[data-g="battle-royale"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-pin .8s cubic-bezier(.3,1.6,.5,1) .75s both; }
@keyframes gf-storm { 0% { --zr: 14em; opacity: 0; background-position: 0 0; } 12% { opacity: .62; } 72% { --zr: .62em; opacity: .62; } 88% { --zr: .62em; opacity: .62; } 100% { --zr: .62em; opacity: 0; background-position: 100% 0; } }
@keyframes gf-zonering { 0% { --zr: 14em; opacity: 0; } 12% { opacity: 1; } 72% { --zr: .62em; opacity: 1; } 88% { --zr: .62em; opacity: 1; } 100% { --zr: .62em; opacity: 0; } }
@keyframes gf-pin { 0% { transform: translateY(-.7em); opacity: 0; } 100% { transform: none; opacity: 1; } }
.aga-gname[data-g="action"] { --a1: #ff3355; --a2: #ffe3ea; --plate: linear-gradient(180deg, #21090f, #100407); --edge: rgba(255, 51, 85, .36); }
.aga-gname[data-g="action"] .aga-gname__fx { z-index: 4; }
.aga-gname[data-g="action"] .aga-gname__fx::before { inset: 0; background: repeating-linear-gradient(100deg, rgba(255, 255, 255, .028) 0 1px, transparent 1px 4px); }
.aga-gname[data-g="action"] .aga-gname__fx::after { left: -15%; width: 130%; top: 50%; height: 1.6px; margin-top: -.8px; background: linear-gradient(90deg, transparent, var(--a2) 38%, #fff 50%, var(--a1) 62%, transparent); transform: rotate(-11deg) scaleX(0); transform-origin: 0 50%; filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 8px var(--a1)); opacity: 0; }
.aga-gname[data-g="action"] .aga-gname__fx b:nth-child(5) { left: -15%; width: 130%; top: 50%; height: .7em; margin-top: -.35em; background: linear-gradient(90deg, transparent, rgba(255, 227, 234, .16), transparent); transform: rotate(-11deg) scaleX(0); transform-origin: 0 50%; opacity: 0; }
.aga-gname[data-g="action"] .aga-gname__fx b:nth-child(1) { left: 6%; width: 88%; top: 50%; height: .55em; margin-top: -.275em; transform: rotate(-11deg); background: linear-gradient(90deg, transparent, #fff 20%, var(--a1) 70%, transparent); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'%3E%3Cpath d='M0 5 7 4.2 12 6.4 19 3.9 25 5.8 31 4.4 37 6.9 44 3.6 51 6.1 57 4.3 64 6.6 70 4.1 77 5.9 84 4.5 90 6.2 100 5M19 3.9 22 1.2M44 3.6 42 .8M64 6.6 67 9.4M84 4.5 87 1.6' fill='none' stroke='%23000' stroke-width='1.1' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'%3E%3Cpath d='M0 5 7 4.2 12 6.4 19 3.9 25 5.8 31 4.4 37 6.9 44 3.6 51 6.1 57 4.3 64 6.6 70 4.1 77 5.9 84 4.5 90 6.2 100 5M19 3.9 22 1.2M44 3.6 42 .8M64 6.6 67 9.4M84 4.5 87 1.6' fill='none' stroke='%23000' stroke-width='1.1' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 100% 100% no-repeat; opacity: 0; }
.aga-gname[data-g="action"] .aga-gname__fx b:nth-child(2) { --dx: .5em; --dy: -.5em; left: 86%; top: 30%; width: .16em; height: .16em; background: var(--a2); clip-path: polygon(0 0, 100% 40%, 30% 100%); opacity: 0; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-shard .7s ease-out .34s both; }
.aga-gname[data-g="action"] .aga-gname__fx b:nth-child(3) { --dx: .6em; --dy: .35em; left: 90%; top: 60%; width: .16em; height: .16em; background: var(--a2); clip-path: polygon(0 0, 100% 40%, 30% 100%); opacity: 0; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-shard .7s ease-out .34s both; }
.aga-gname[data-g="action"] .aga-gname__fx b:nth-child(4) { --dx: .35em; --dy: .55em; left: 80%; top: 52%; width: .16em; height: .16em; background: var(--a2); clip-path: polygon(0 0, 100% 40%, 30% 100%); opacity: 0; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-shard .7s ease-out .34s both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-cut .46s cubic-bezier(.75,0,.2,1) both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(5) { animation: gf-trail .5s cubic-bezier(.75,0,.2,1) .03s both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-crack 1.2s ease-out .3s both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t { animation: gf-hide .6s .24s steps(1, end) both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t::before { content: attr(data-t); position: absolute; inset: 0; color: var(--ink, #ece3d4); opacity: 0; clip-path: polygon(0 0, 100% 0, 100% 36%, 0 64%); animation: gf-upper .6s .24s cubic-bezier(.2,.8,.2,1) both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t::after { content: attr(data-t); position: absolute; inset: 0; color: var(--ink, #ece3d4); opacity: 0; clip-path: polygon(0 64%, 100% 36%, 100% 100%, 0 100%); animation: gf-lower .6s .24s cubic-bezier(.2,.8,.2,1) both; }
.aga-gname[data-g="action"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-draw .55s cubic-bezier(.2,.8,.2,1) both; }
@keyframes gf-cut { 0% { transform: rotate(-11deg) scaleX(0); opacity: 1; } 55% { transform: rotate(-11deg) scaleX(1); opacity: 1; } 100% { transform: rotate(-11deg) scaleX(1) translateX(5%); opacity: 0; } }
@keyframes gf-trail { 0% { transform: rotate(-11deg) scaleX(0); opacity: 1; } 60% { transform: rotate(-11deg) scaleX(1); opacity: .9; } 100% { transform: rotate(-11deg) scaleX(1); opacity: 0; } }
@keyframes gf-crack { 0% { opacity: 0; clip-path: inset(0 100% 0 0); } 18% { opacity: .95; clip-path: inset(0 0 0 0); } 60% { opacity: .45; } 100% { opacity: 0; clip-path: inset(0 0 0 0); } }
@keyframes gf-shard { 0% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(160deg); } }
@keyframes gf-hide { 0%, 99% { color: transparent; } 100% { color: var(--ink, #ece3d4); } }
@keyframes gf-upper { 0% { opacity: 1; transform: none; } 30% { opacity: 1; transform: translate(.08em, -.05em); } 99% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes gf-lower { 0% { opacity: 1; transform: none; } 30% { opacity: 1; transform: translate(-.08em, .05em); } 99% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes gf-draw { 0% { transform: rotate(-35deg); } 60% { transform: rotate(8deg); } 100% { transform: none; } }
.aga-gname[data-g="rpg"] { --a1: #ffb347; --a2: #a68bff; --slot-b: .34em; --plate: linear-gradient(180deg, #23170b, #110b05); --edge: rgba(255, 179, 71, .38); }
.aga-gname[data-g="rpg"]::before { inset: 2px; opacity: .9; background: linear-gradient(135deg, var(--gilt-hi, #f6dfa4), var(--gilt, #d5a95a)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") left top / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(-1 0 0 1 12 0)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(-1 0 0 1 12 0)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") right top / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(1 0 0 -1 0 12)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(1 0 0 -1 0 12)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") left bottom / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(-1 0 0 -1 12 12)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(-1 0 0 -1 12 12)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") right bottom / .6em .6em no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") left top / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(-1 0 0 1 12 0)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(-1 0 0 1 12 0)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") right top / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(1 0 0 -1 0 12)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(1 0 0 -1 0 12)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") left bottom / .6em .6em no-repeat, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath transform='matrix(-1 0 0 -1 12 12)' d='M1.2 11V5.2Q1.2 1.2 5.2 1.2H11M3.6 11V6.6Q3.6 3.6 6.6 3.6H11' fill='none' stroke='%23000' stroke-width='1' stroke-linecap='round'/%3E%3Ccircle transform='matrix(-1 0 0 -1 12 12)' cx='3.6' cy='11' r='.9'/%3E%3C/svg%3E") right bottom / .6em .6em no-repeat; }
.aga-gname[data-g="rpg"] .aga-gname__fx::before { left: 1.9em; right: .6em; bottom: .07em; height: .34em; opacity: .42; background: linear-gradient(90deg, transparent 38%, #fff6d8 50%, transparent 62%) 100% 0 / 300% 100% no-repeat, linear-gradient(90deg, #8a5f22, #d5a95a); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 0 50% / 1.7em .34em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 0 50% / 1.7em .34em repeat-x; }
.aga-gname[data-g="rpg"] .aga-gname__fx b:nth-child(4) { left: .93em; top: 50%; width: 1.9em; height: 1.9em; margin: -.95em 0 0 -.95em; border-radius: 50%; background: radial-gradient(circle, rgba(166, 139, 255, .45), transparent 65%); opacity: 0; }
.aga-gname[data-g="rpg"] .aga-gname__fx b:nth-child(1) { left: 34%; bottom: .1em; width: .22em; height: .36em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 28.57% 0 / 800% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 28.57% 0 / 800% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 4px var(--a2)); }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-runerise 1.2s ease-out .15s both; }
.aga-gname[data-g="rpg"] .aga-gname__fx b:nth-child(2) { left: 58%; bottom: .1em; width: .22em; height: .36em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 71.43% 0 / 800% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 71.43% 0 / 800% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 4px var(--a2)); }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-runerise 1.2s ease-out .32s both; }
.aga-gname[data-g="rpg"] .aga-gname__fx b:nth-child(3) { left: 80%; bottom: .1em; width: .22em; height: .36em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 100.00% 0 / 800% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 16'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath transform='translate(0 0)' d='M3 2V14M3 4.2 8 1.8M3 8.2 8 5.8'/%3E%3Cpath transform='translate(10 0)' d='M3 2V14M3 2 7.2 4.6 3 7.6 7.6 14'/%3E%3Cpath transform='translate(20 0)' d='M5 2V14M5 7 1.6 2.4M5 7 8.4 2.4'/%3E%3Cpath transform='translate(30 0)' d='M5 1.6 8.4 6 5 10.4 1.6 6ZM3.2 8.4 1.2 14M6.8 8.4 8.8 14'/%3E%3Cpath transform='translate(40 0)' d='M5 2V14M1.6 5.6 5 2 8.4 5.6'/%3E%3Cpath transform='translate(50 0)' d='M1.6 2V14M8.4 2V14M1.6 2 8.4 14M8.4 2 1.6 14'/%3E%3Cpath transform='translate(60 0)' d='M2 2V14M8 2V14M2 2 8 7M8 2 2 7'/%3E%3Cpath transform='translate(70 0)' d='M5 2V14M2.4 6 7.6 10'/%3E%3C/g%3E%3C/svg%3E") 100.00% 0 / 800% 100% no-repeat; opacity: 0; filter: drop-shadow(0 0 4px var(--a2)); }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-runerise 1.2s ease-out .48s both; }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-runeglow 1.4s ease-in-out both; }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-glow 1.4s ease-out both; }
.aga-gname[data-g="rpg"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-arcane 1.4s ease-out both; }
@keyframes gf-runeglow { 0% { opacity: .42; background-position: 100% 0, 0 0; } 18% { opacity: 1; filter: drop-shadow(0 0 3px #ffb347); } 100% { opacity: .6; background-position: 0 0, 0 0; filter: none; } }
@keyframes gf-runerise { 0% { opacity: 0; transform: translateY(0) scale(.8); } 25% { opacity: 1; } 100% { opacity: 0; transform: translateY(-1.3em) scale(1.1); } }
@keyframes gf-glow { 0% { opacity: 0; } 30% { opacity: 1; } 100% { opacity: 0; } }
@keyframes gf-arcane { 0%, 100% { transform: none; filter: none; } 30% { transform: scale(1.18); filter: drop-shadow(0 0 6px var(--a2)) brightness(1.3); } }
.aga-gname[data-g="adventure"] { --a1: #7ad6a0; --a2: #e9c98a; --slot-b: .34em; --plate: linear-gradient(180deg, #0f1d15, #08110c); --edge: rgba(122, 214, 160, .36); }
.aga-gname[data-g="adventure"] .aga-gname__fx::before { --rv: 100%; left: 1.9em; right: .55em; bottom: .05em; height: .36em; opacity: .55; background: linear-gradient(90deg, var(--a2), var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 8'%3E%3Cpath d='M0 4C4 .6 8 .6 12 4S20 7.4 24 4' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-dasharray='.01 3.795' stroke-dashoffset='-1.903'/%3E%3C/svg%3E") 0 50% / 1.08em .36em repeat-x, linear-gradient(90deg, #000 var(--rv), transparent calc(var(--rv) + .8em)); -webkit-mask-composite: source-in; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 8'%3E%3Cpath d='M0 4C4 .6 8 .6 12 4S20 7.4 24 4' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-dasharray='.01 3.795' stroke-dashoffset='-1.903'/%3E%3C/svg%3E") 0 50% / 1.08em .36em repeat-x, linear-gradient(90deg, #000 var(--rv), transparent calc(var(--rv) + .8em)); mask-composite: intersect; }
.aga-gname[data-g="adventure"] .aga-gname__fx b:nth-child(1) { left: 1.9em; bottom: .1em; width: .3em; height: .3em; margin-left: -.15em; border-radius: 50%; background: radial-gradient(circle, #fff7dc, var(--a2) 45%, rgba(233, 201, 138, 0) 72%); opacity: 0; }
.aga-gname[data-g="adventure"] .aga-gname__fx b:nth-child(2) { right: .38em; bottom: .02em; width: .5em; height: .5em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-route 1.5s cubic-bezier(.45,0,.2,1) both; }
.aga-gname[data-g="adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-walker 1.5s cubic-bezier(.45,0,.2,1) both; }
.aga-gname[data-g="adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-star .7s cubic-bezier(.3,1.6,.5,1) 1s both; }
.aga-gname[data-g="adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-compass 1.4s cubic-bezier(.2,.9,.25,1.15) both; }
@keyframes gf-route { 0% { --rv: 0%; opacity: 1; -webkit-mask-position: 0 50%, 0 0; mask-position: 0 50%, 0 0; } 72% { --rv: 100%; } 100% { --rv: 100%; opacity: .55; -webkit-mask-position: -2.16em 50%, 0 0; mask-position: -2.16em 50%, 0 0; } }
@keyframes gf-walker { 0% { left: 1.9em; opacity: 1; } 72% { left: calc(100% - .7em); opacity: 1; } 100% { left: calc(100% - .7em); opacity: 0; } }
@keyframes gf-star { 0% { transform: scale(0) rotate(-45deg); opacity: 0; } 60% { transform: scale(1.25) rotate(10deg); opacity: 1; } 100% { transform: scale(0) rotate(45deg); opacity: 0; } }
@keyframes gf-compass { 0% { transform: rotate(0); } 100% { transform: rotate(720deg); } }
.aga-gname[data-g="strategy"] { --a1: #5aa0ff; --a2: #ff5d5d; --plate: linear-gradient(180deg, #0d1422, #070b13); --edge: rgba(90, 160, 255, .36); }
.aga-gname[data-g="strategy"] .aga-gname__fx { --front: 44%; }
.aga-gname[data-g="strategy"] .aga-gname__fx::before { inset: 0; background: repeating-linear-gradient(60deg, rgba(160, 190, 255, .06) 0 1px, transparent 1px 9px), repeating-linear-gradient(-60deg, rgba(160, 190, 255, .06) 0 1px, transparent 1px 9px), linear-gradient(90deg, rgba(90, 160, 255, .17) var(--front), rgba(255, 93, 93, .12) var(--front)); }
.aga-gname[data-g="strategy"] .aga-gname__fx b:nth-child(1) { left: var(--front); top: 0; bottom: 0; width: .3em; margin-left: -.15em; background: linear-gradient(180deg, #fff, var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 12'%3E%3Cpath d='M3 0 5 3 1 6 5 9 3 12' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0 / .3em .6em repeat-y; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 12'%3E%3Cpath d='M3 0 5 3 1 6 5 9 3 12' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 0 0 / .3em .6em repeat-y; opacity: 0; filter: drop-shadow(0 0 3px var(--a1)); }
.aga-gname[data-g="strategy"] .aga-gname__fx b:nth-child(2) { left: calc(var(--front) + .25em); top: 50%; width: .62em; height: .46em; margin-top: -.23em; background: var(--a1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 1 5 5 1 9M6 1 10 5 6 9' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 1 5 5 1 9M6 1 10 5 6 9' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="strategy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx { animation: gf-front 1.7s cubic-bezier(.4,0,.2,1) both; }
.aga-gname[data-g="strategy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-frontglow 1.7s ease-out both; }
.aga-gname[data-g="strategy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-chev 1.7s ease-out both; }
.aga-gname[data-g="strategy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-move 1s cubic-bezier(.3,.9,.3,1) both; }
@keyframes gf-front { 0% { --front: 44%; } 45% { --front: 76%; } 60% { --front: 72%; } 82% { --front: 72%; } 100% { --front: 44%; } }
@keyframes gf-frontglow { 0% { opacity: 0; } 12%, 80% { opacity: 1; } 100% { opacity: 0; } }
@keyframes gf-chev { 0% { opacity: 0; transform: translateX(-.2em); } 20%, 55% { opacity: 1; transform: translateX(.1em); } 75%, 100% { opacity: 0; transform: translateX(.3em); } }
@keyframes gf-move { 0% { transform: none; } 35% { transform: translateY(-.32em) rotate(-6deg); } 70% { transform: translateY(.04em) scale(1.06, .9); } 100% { transform: none; } }
.aga-gname[data-g="simulation"] { --a1: #4de0c2; --a2: #b8fff1; --slot-b: .4em; --slot-r: 1.25em; --wave-c: var(--a1); --wave-h: .38em; --wave-tile: 1.267em; --plate: linear-gradient(180deg, #0a1c19, #050f0d); --edge: rgba(77, 224, 194, .36); }
.aga-gname[data-g="simulation"] .aga-gname__fx::before { left: .5em; right: .5em; bottom: .06em; height: var(--wave-h); border-top: 1px solid rgba(77, 224, 194, .14); background: repeating-linear-gradient(90deg, rgba(77, 224, 194, .12) 0 1px, transparent 1px .32em), linear-gradient(rgba(77, 224, 194, .1), rgba(77, 224, 194, .1)) 0 50% / 100% 1px no-repeat; }
.aga-gname[data-g="simulation"] .aga-gname__fx::after { left: .5em; right: .5em; bottom: .06em; height: var(--wave-h); opacity: .62; background: linear-gradient(90deg, transparent, var(--wave-c) 15%, var(--wave-c) 85%, transparent); filter: drop-shadow(0 0 2px var(--wave-c)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 12'%3E%3Cpath d='M0 7H12L14 5.2 16 7H19L21 1.6 23.5 11 25.5 4.4 27 7H31L33 5.6 35 7H40' fill='none' stroke='%23000' stroke-width='1.2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E") 0 50% / var(--wave-tile) var(--wave-h) repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 12'%3E%3Cpath d='M0 7H12L14 5.2 16 7H19L21 1.6 23.5 11 25.5 4.4 27 7H31L33 5.6 35 7H40' fill='none' stroke='%23000' stroke-width='1.2' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E") 0 50% / var(--wave-tile) var(--wave-h) repeat-x; }
.aga-gname[data-g="simulation"] .aga-gname__fx b:nth-child(1) { left: .5em; bottom: .06em; width: .5em; height: var(--wave-h); background: radial-gradient(closest-side, var(--a2), rgba(184, 255, 241, 0)); opacity: 0; }
.aga-gname[data-g="simulation"] .aga-gname__fx b:nth-child(2) { right: calc(.45em + 0.0em); top: .34em; width: .2em; height: .2em; border-radius: 50%; background: var(--a1); opacity: .22; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-led 1.2s ease-out 0.15s both; }
.aga-gname[data-g="simulation"] .aga-gname__fx b:nth-child(3) { right: calc(.45em + 0.36em); top: .34em; width: .2em; height: .2em; border-radius: 50%; background: var(--a1); opacity: .22; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-led 1.2s ease-out 0.30s both; }
.aga-gname[data-g="simulation"] .aga-gname__fx b:nth-child(4) { right: calc(.45em + 0.72em); top: .34em; width: .2em; height: .2em; border-radius: 50%; background: var(--a1); opacity: .22; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-led 1.2s ease-out 0.45s both; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-wave 1.3s linear both; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-scanhead 1.3s linear both; }
.aga-gname[data-g="simulation"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-gear 1.3s cubic-bezier(.2,.8,.2,1) both; }
@keyframes gf-wave { 0% { opacity: .62; -webkit-mask-position: 0 50%; mask-position: 0 50%; } 15% { opacity: 1; } 100% { opacity: .62; -webkit-mask-position: calc(var(--wave-tile) * -2) 50%; mask-position: calc(var(--wave-tile) * -2) 50%; } }
@keyframes gf-scanhead { 0% { left: .5em; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { left: calc(100% - 1em); opacity: 0; } }
@keyframes gf-led { 0% { opacity: .22; } 25% { opacity: 1; box-shadow: 0 0 7px var(--a1); } 100% { opacity: .22; } }
@keyframes gf-gear { from { transform: rotate(0); } to { transform: rotate(180deg); } }
.aga-gname[data-g="life-sim"] { --a1: #ff8fc8; --a2: #ffd27a; --plate: linear-gradient(180deg, #24101d, #12080f); --edge: rgba(255, 143, 200, .36); }
.aga-gname[data-g="life-sim"] .aga-gname__fx::before { inset: 0; opacity: 0; background: linear-gradient(90deg, hsl(245 55% 24% / .65) 0%, hsl(318 60% 46% / .5) 30%, hsl(36 92% 62% / .42) 50%, hsl(198 72% 58% / .3) 70%, hsl(245 55% 24% / .65) 100%) 0 0 / 500% 100%; }
.aga-gname[data-g="life-sim"] .aga-gname__fx b:nth-child(1) { left: 6%; top: 70%; width: .34em; height: .34em; margin: -.17em 0 0 -.17em; border-radius: 50%; background: radial-gradient(circle, #fff7d6, var(--a2) 45%, rgba(255, 210, 122, 0) 72%); opacity: 0; }
.aga-gname[data-g="life-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-day 1.7s ease-in-out both; }
.aga-gname[data-g="life-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-arc 1.7s ease-in-out both; }
.aga-gname[data-g="life-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-rise 1.7s ease-in-out both; }
@keyframes gf-day { 0% { background-position: 0 0; opacity: 0; } 12% { opacity: 1; } 85% { opacity: 1; } 100% { background-position: 100% 0; opacity: 0; } }
@keyframes gf-arc { 0% { left: 6%; top: 75%; opacity: 0; } 15% { opacity: 1; } 50% { left: 50%; top: 14%; } 85% { opacity: 1; } 100% { left: 94%; top: 75%; opacity: 0; } }
@keyframes gf-rise { 0% { transform: translateY(.22em); filter: brightness(.6); } 50% { transform: translateY(-.08em); filter: brightness(1.45) drop-shadow(0 0 5px hsl(40 100% 65%)); } 100% { transform: none; filter: none; } }
.aga-gname[data-g="sandbox"] { --a1: #8fd14f; --a2: #b98552; --slot-r: 1.15em; --plate: linear-gradient(180deg, #15200d, #0a1006); --edge: rgba(143, 209, 79, .36); }
.aga-gname[data-g="sandbox"] .aga-gname__fx b:nth-child(1) { right: .4em; bottom: .2em; width: .3em; height: .3em; background: linear-gradient(180deg, #c6cad3 0 24%, #9298a5 24% 76%, #646a76 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.00s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx b:nth-child(2) { right: .7em; bottom: .2em; width: .3em; height: .3em; background: linear-gradient(180deg, #d8aa72 0 24%, #b98552 24% 76%, #80582f 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.07s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx b:nth-child(3) { right: 1em; bottom: .2em; width: .3em; height: .3em; background: linear-gradient(180deg, #d8aa72 0 24%, #b98552 24% 76%, #80582f 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.14s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx b:nth-child(4) { right: .4em; bottom: .5em; width: .3em; height: .3em; background: linear-gradient(180deg, #d8aa72 0 24%, #b98552 24% 76%, #80582f 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.26s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx b:nth-child(5) { right: .7em; bottom: .5em; width: .3em; height: .3em; background: linear-gradient(180deg, #c8f08a 0 24%, #8fd14f 24% 76%, #5f9a2e 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(5) { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.33s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx::after { right: .4em; bottom: .8em; width: .3em; height: .3em; background: linear-gradient(180deg, #c8f08a 0 24%, #8fd14f 24% 76%, #5f9a2e 76%); box-shadow: inset 0 0 0 .025em rgba(0, 0, 0, .3); }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-vox .8s cubic-bezier(.4,0,.3,1) 0.45s both; }
.aga-gname[data-g="sandbox"] .aga-gname__fx::before { right: .25em; bottom: .12em; width: 1.4em; height: .3em; background: radial-gradient(closest-side, rgba(220, 200, 160, .4), transparent); opacity: 0; }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-dust .9s ease-out .3s both; }
.aga-gname[data-g="sandbox"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-flip .9s ease-in-out both; }
@keyframes gf-vox { 0% { transform: translateY(-1.6em); opacity: 0; } 50% { transform: translateY(0) scale(1.08, .84); opacity: 1; } 66% { transform: translateY(-.06em) scale(.96, 1.04); } 82%, 100% { transform: none; opacity: 1; } }
@keyframes gf-dust { 0% { opacity: 0; transform: scaleX(.5); } 30% { opacity: 1; } 100% { opacity: 0; transform: scaleX(1.4); } }
@keyframes gf-flip { 0% { transform: none; } 50% { transform: scaleX(-1); } 100% { transform: none; } }
.aga-gname[data-g="puzzle"] { --a1: #a98bff; --a2: #ffd27a; --pad-l: .5em; --plate: linear-gradient(180deg, #170f26, #0b0713); --edge: rgba(169, 139, 255, .38); }
.aga-gname[data-g="puzzle"] .aga-gname__sig { margin-right: .85em; }
.aga-gname[data-g="puzzle"] .aga-gname__fx::before { left: 1.31em; top: 0; bottom: 0; width: .6em; opacity: .78; background: linear-gradient(180deg, var(--a2), var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 48'%3E%3Cpath d='M4 0V18.5C4 20.2 6.2 20.8 7.4 19.6C9.6 17.4 14.4 18.4 14.4 24C14.4 29.6 9.6 30.6 7.4 28.4C6.2 27.2 4 27.8 4 29.5V48' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 50% / .6em 1.8em no-repeat, linear-gradient(#000 0 0) calc(.15em - .7px) 0 / 1.4px max(0px, calc(50% - .88em)) no-repeat, linear-gradient(#000 0 0) calc(.15em - .7px) 100% / 1.4px max(0px, calc(50% - .88em)) no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 48'%3E%3Cpath d='M4 0V18.5C4 20.2 6.2 20.8 7.4 19.6C9.6 17.4 14.4 18.4 14.4 24C14.4 29.6 9.6 30.6 7.4 28.4C6.2 27.2 4 27.8 4 29.5V48' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 50% / .6em 1.8em no-repeat, linear-gradient(#000 0 0) calc(.15em - .7px) 0 / 1.4px max(0px, calc(50% - .88em)) no-repeat, linear-gradient(#000 0 0) calc(.15em - .7px) 100% / 1.4px max(0px, calc(50% - .88em)) no-repeat; }
.aga-gname[data-g="puzzle"] .aga-gname__fx b:nth-child(1) { left: calc(1.31em + .15em); top: -.3em; width: .3em; height: .3em; margin-left: -.15em; border-radius: 50%; background: radial-gradient(circle, #fff, var(--a2) 40%, rgba(255, 210, 122, 0) 70%); opacity: 0; }
.aga-gname[data-g="puzzle"] .aga-gname__fx b:nth-child(2) { left: calc(1.31em + .41em); top: 50%; width: 1em; height: 1em; margin: -.5em 0 0 -.5em; border-radius: 50%; border: 1.5px solid var(--a2); opacity: 0; }
.aga-gname[data-g="puzzle"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-piece .9s cubic-bezier(.5,0,.3,1.4) both; }
.aga-gname[data-g="puzzle"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-seam 1.4s ease-out both; }
.aga-gname[data-g="puzzle"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-seamrun .8s ease-in-out .5s both; }
.aga-gname[data-g="puzzle"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-click .9s ease-out .45s both; }
@keyframes gf-piece { 0% { transform: translateX(-.3em) rotate(-12deg); opacity: .6; } 55% { transform: translateX(.03em); opacity: 1; } 65% { transform: scale(1.14); } 100% { transform: none; } }
@keyframes gf-seam { 0%, 30% { opacity: .78; filter: none; } 45% { opacity: 1; filter: drop-shadow(0 0 4px var(--a2)); } 100% { opacity: .78; filter: none; } }
@keyframes gf-seamrun { 0% { top: -.3em; opacity: 1; } 100% { top: 100%; opacity: 1; } }
@keyframes gf-click { 0% { transform: scale(.4); opacity: 0; } 15% { opacity: 1; } 100% { transform: scale(2); opacity: 0; } }
.aga-gname[data-g="horror"] { --a1: #c0152f; --a2: #e8d9d0; --below: .26em; --plate: linear-gradient(180deg, #1a0709, #0c0304); --edge: rgba(192, 21, 47, .36); }
.aga-gname[data-g="horror"] .aga-gname__fx::before { left: 0; right: 0; top: 0; height: .58em; opacity: 1; background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .09) 0 1px, transparent 1.6px) 0 0 / 5px 4px, radial-gradient(circle, rgba(20, 0, 4, .5) 0 1.2px, transparent 1.8px) 2px 1px / 7px 6px, linear-gradient(180deg, #2a040b 0%, #4a0812 40%, #8e1022 100%); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 10' preserveAspectRatio='none'%3E%3Cpath d='M0 0H60V3.2C57 3.6 55.5 2.6 53 3.4 51.6 3.9 51.2 6.8 50.2 7.2 49.2 7.6 49 4.4 47.6 3.9 44 2.8 41 4.4 37 3.6 33 2.8 31 3.8 28.6 3.5 27.4 3.4 27.2 5.2 26.4 5.4 25.6 5.6 25.5 3.8 24.4 3.4 20 2 16 4.2 12 3.3 9 2.7 7.5 3.8 6 3.6 5.2 3.5 5 8.6 3.9 8.8 2.8 9 2.9 4 2 3.6 1.4 3.4 .6 3.3 0 3.4Z'/%3E%3C/svg%3E") 0 0 / 3.8em 100% repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 10' preserveAspectRatio='none'%3E%3Cpath d='M0 0H60V3.2C57 3.6 55.5 2.6 53 3.4 51.6 3.9 51.2 6.8 50.2 7.2 49.2 7.6 49 4.4 47.6 3.9 44 2.8 41 4.4 37 3.6 33 2.8 31 3.8 28.6 3.5 27.4 3.4 27.2 5.2 26.4 5.4 25.6 5.6 25.5 3.8 24.4 3.4 20 2 16 4.2 12 3.3 9 2.7 7.5 3.8 6 3.6 5.2 3.5 5 8.6 3.9 8.8 2.8 9 2.9 4 2 3.6 1.4 3.4 .6 3.3 0 3.4Z'/%3E%3C/svg%3E") 0 0 / 3.8em 100% repeat-x; }
.aga-gname[data-g="horror"] .aga-gname__fx::after { inset: 0; background: radial-gradient(120% 160% at 50% 50%, transparent 55%, rgba(0, 0, 0, .6)); }
.aga-gname[data-g="horror"] .aga-gname__fx b:nth-child(1) { left: .2em; top: .3em; width: .13em; height: 0; border-radius: 0 0 .1em .1em; background: linear-gradient(180deg, #3a0610, #a3132a 85%, #d42a42); box-shadow: inset .025em 0 0 rgba(255, 255, 255, .22); }
.aga-gname[data-g="horror"] .aga-gname__fx b:nth-child(1)::after { left: 50%; bottom: -.08em; width: .21em; height: .23em; margin-left: -.105em; border-radius: 50% 50% 50% 50% / 60% 60% 42% 42%; background: radial-gradient(circle at 35% 35%, #ff6b7d, #a3132a 60%, #5a0a16); }
.aga-gname[data-g="horror"]::after { right: .42em; top: .3em; width: .22em; height: 0; z-index: 2; background: radial-gradient(circle at 50% calc(100% - .1em), #e0485c 0 .03em, #a3132a .1em, transparent .115em), linear-gradient(180deg, #3a0610, #a3132a) 50% 0 / .12em calc(100% - .12em) no-repeat; }
.aga-gname[data-g="horror"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-drip1 1.7s cubic-bezier(.6,0,.4,1) .2s both; }
.aga-gname[data-g="horror"]:is(.is-lit, :has(a:focus-visible))::after { animation: gf-drip2 1.9s cubic-bezier(.6,0,.4,1) .35s both; }
.aga-gname[data-g="horror"]:is(.is-lit, :has(a:focus-visible)) { animation: gf-candle 1.3s steps(1) both; }
.aga-gname[data-g="horror"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t::after { content: attr(data-t); position: absolute; inset: 0; color: #ff3d55; opacity: 0; animation: gf-ghost 1.3s ease-out .1s both; }
.aga-gname[data-g="horror"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-blink 1.3s ease-in-out both; }
@keyframes gf-drip1 { 0% { height: 0; opacity: 1; } 70% { height: 1.05em; opacity: 1; } 100% { height: 1.05em; opacity: 0; } }
@keyframes gf-drip2 { 0% { height: 0; opacity: 1; } 70% { height: calc(100% - .3em + .26em); opacity: 1; } 100% { height: calc(100% - .3em + .26em); opacity: 0; } }
@keyframes gf-candle { 0%, 100% { border-color: rgba(192, 21, 47, .36); } 8% { border-color: rgba(255, 40, 70, .95); } 12% { border-color: rgba(192, 21, 47, .15); } 34% { border-color: rgba(255, 40, 70, .8); } 40% { border-color: rgba(192, 21, 47, .3); } }
@keyframes gf-ghost { 0% { opacity: 0; transform: none; filter: blur(0); } 18% { opacity: .6; transform: translate(.06em, -.03em); filter: blur(.4px); } 55% { opacity: .3; transform: translate(-.1em, .03em); filter: blur(1.2px); } 100% { opacity: 0; transform: translate(.16em, -.06em); filter: blur(3px); } }
@keyframes gf-blink { 0%, 30%, 52%, 100% { transform: none; } 40% { transform: scaleY(.08); } }
.aga-gname[data-g="roguelike"] { --a1: #e07cff; --a2: #ffd27a; --plate: linear-gradient(180deg, #1c0d22, #0e0611); --edge: rgba(224, 124, 255, .36); }
.aga-gname[data-g="roguelike"] .aga-gname__sig { --sig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 144 24'%3E%3Cpath fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM9.9 12a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM31 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H31a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM29.3 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM38.5 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM55 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H55a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM53.3 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM57.9 12a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM62.5 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM79 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H79a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM77.3 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM86.5 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM77.3 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM86.5 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM103 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H103a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM101.3 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM110.5 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM105.9 12a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM101.3 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM110.5 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM127 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H127a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zM125.3 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM125.3 12a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM125.3 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM134.5 7.4a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM134.5 12a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0zM134.5 16.6a2.1 2.1 0 1 0 4.2 0a2.1 2.1 0 1 0-4.2 0z'/%3E%3C/svg%3E"); -webkit-mask-size: 600% 100%; mask-size: 600% 100%; -webkit-mask-position: 80% 0; mask-position: 80% 0; background: linear-gradient(140deg, #fff5fd, var(--a1) 85%); }
.aga-gname[data-g="roguelike"] .aga-gname__fx::before { inset: 0; background: repeating-linear-gradient(0deg, rgba(224, 124, 255, .05) 0 1px, transparent 1px .5em), repeating-linear-gradient(90deg, rgba(224, 124, 255, .05) 0 1px, transparent 1px .9em); }
.aga-gname[data-g="roguelike"] .aga-gname__fx b:nth-child(1) { left: .93em; top: 50%; width: 1.3em; height: 1.3em; margin: -.65em 0 0 -.65em; border-radius: 50%; box-shadow: 0 0 0 2px var(--a1); opacity: 0; }
.aga-gname[data-g="roguelike"] .aga-gname__fx b:nth-child(2) { left: 1.25em; top: .1em; width: .42em; height: .42em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="roguelike"] .aga-gname__fx b:nth-child(3) { left: .93em; bottom: .12em; width: .7em; height: .16em; margin-left: -.35em; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .55), transparent); opacity: .7; }
.aga-gname[data-g="roguelike"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-faces 1.1s steps(1, end) both, gf-tumble 1.1s cubic-bezier(.2,.75,.25,1) both; }
.aga-gname[data-g="roguelike"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-ping .8s ease-out .62s both; }
.aga-gname[data-g="roguelike"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-star .6s cubic-bezier(.3,1.6,.5,1) .8s both; }
.aga-gname[data-g="roguelike"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-shadow 1.1s cubic-bezier(.2,.75,.25,1) both; }
@keyframes gf-faces { 0% { -webkit-mask-position: 0% 0; mask-position: 0% 0; } 7% { -webkit-mask-position: 40% 0; mask-position: 40% 0; } 14% { -webkit-mask-position: 80% 0; mask-position: 80% 0; } 21% { -webkit-mask-position: 20% 0; mask-position: 20% 0; } 28% { -webkit-mask-position: 100% 0; mask-position: 100% 0; } 35% { -webkit-mask-position: 60% 0; mask-position: 60% 0; } 42% { -webkit-mask-position: 0% 0; mask-position: 0% 0; } 50% { -webkit-mask-position: 80% 0; mask-position: 80% 0; } 62% { -webkit-mask-position: 40% 0; mask-position: 40% 0; } 76%, 100% { -webkit-mask-position: 100% 0; mask-position: 100% 0; } }
@keyframes gf-tumble { 0% { transform: translate(-.5em, -.9em) rotate(-540deg) scale(.8); } 50% { transform: rotate(-40deg) scale(1); } 62% { transform: rotate(8deg) scale(1.12, .9); } 76% { transform: rotate(-3deg); } 100% { transform: none; } }
@keyframes gf-shadow { 0% { transform: scale(.3); opacity: .2; } 50% { transform: scale(1); opacity: .7; } 62% { transform: scale(1.15); } 100% { transform: none; opacity: .7; } }
.aga-gname[data-g="interactive-fiction"] { --a1: #e9cf98; --a2: #fff3d6; --slot-b: .3em; --slot-r: .3em; --plate: radial-gradient(circle at 20% 30%, rgba(255, 240, 200, .05) 0 1px, transparent 1.5px) 0 0 / 7px 6px, linear-gradient(180deg, #2b2116, #16100a); --edge: rgba(233, 207, 152, .4); }
.aga-gname[data-g="interactive-fiction"]::after { right: -1px; top: -1px; width: .62em; height: .62em; transform-origin: 100% 0; background: linear-gradient(225deg, transparent 0 49%, rgba(0, 0, 0, .45) 49% 53%, #e2c98f 53%, #9c814e 100%); filter: drop-shadow(-1px 1px 1px rgba(0, 0, 0, .4)); }
.aga-gname[data-g="interactive-fiction"] .aga-gname__fx { --inkf: 1; }
.aga-gname[data-g="interactive-fiction"] .aga-gname__fx::before { left: 1.85em; right: .95em; bottom: .05em; height: .3em; opacity: .32; background: linear-gradient(90deg, var(--a1), var(--a2)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8C12 3 22 3 30 7S48 11 58 6C66 2 74 2 80 6C84 9 88 10 92 7C95 5 96 2 94 2C92 2 91 5 94 7C100 10 110 9 118 5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat, linear-gradient(90deg, #000 calc(var(--inkf) * 100%), transparent calc(var(--inkf) * 100% + .6em)); -webkit-mask-composite: source-in; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8C12 3 22 3 30 7S48 11 58 6C66 2 74 2 80 6C84 9 88 10 92 7C95 5 96 2 94 2C92 2 91 5 94 7C100 10 110 9 118 5' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat, linear-gradient(90deg, #000 calc(var(--inkf) * 100%), transparent calc(var(--inkf) * 100% + .6em)); mask-composite: intersect; }
.aga-gname[data-g="interactive-fiction"] .aga-gname__fx b:nth-child(1) { left: calc(1.85em + (100% - 2.8em) * var(--inkf)); bottom: .02em; width: .3em; height: .3em; margin-left: -.15em; border-radius: 50%; background: radial-gradient(circle, #fff, var(--a2) 35%, rgba(233, 207, 152, 0) 70%); opacity: 0; }
.aga-gname[data-g="interactive-fiction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx { animation: gf-ink 1.5s cubic-bezier(.55,.05,.3,1) both; }
.aga-gname[data-g="interactive-fiction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-inkshow 1.5s ease-out both; }
.aga-gname[data-g="interactive-fiction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-nib 1.5s ease-out both; }
.aga-gname[data-g="interactive-fiction"]:is(.is-lit, :has(a:focus-visible))::after { animation: gf-flap 1.5s ease-out both; }
.aga-gname[data-g="interactive-fiction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-quill 1.5s ease-in-out both; }
@keyframes gf-ink { 0% { --inkf: 0; } 85%, 100% { --inkf: 1; } }
@keyframes gf-inkshow { 0% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: .32; } }
@keyframes gf-nib { 0% { opacity: 0; } 8% { opacity: 1; } 82% { opacity: 1; } 100% { opacity: 0; } }
@keyframes gf-flap { 0% { transform: none; } 20% { transform: rotate(-8deg) scale(1.25); } 60% { transform: rotate(-3deg) scale(1.1); } 100% { transform: none; } }
@keyframes gf-quill { 0% { transform: rotate(-16deg) translate(-.05em, -.05em); } 30% { transform: rotate(-6deg) translateY(.06em); } 60% { transform: rotate(-12deg); } 85% { transform: rotate(4deg); } 100% { transform: none; } }
.aga-gname[data-g="text-adventure"] { --a1: #7cff9a; --a2: #1f6b3a; --gn-font: "SF Mono", "Cascadia Code", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace; --gn-scale: .84; --gn-weight: 600; --gn-track: 0; --gn-ink: #c8ffd5; --slot-r: .75em; --plate: linear-gradient(180deg, #04150b, #020a05); --edge: rgba(124, 255, 154, .32); }
.aga-gname[data-g="text-adventure"]::before { background: none; }
.aga-gname[data-g="text-adventure"] .aga-gname__t { text-shadow: 0 0 6px rgba(124, 255, 154, .45); }
.aga-gname[data-g="text-adventure"] .aga-gname__fx::before { inset: 0; background: repeating-linear-gradient(180deg, rgba(124, 255, 154, .07) 0 1px, transparent 1px 3px), radial-gradient(120% 140% at 50% 50%, transparent 60%, rgba(0, 0, 0, .55)); }
.aga-gname[data-g="text-adventure"]::after { right: .3em; bottom: .3em; width: .42em; height: .1em; background: var(--a1); box-shadow: 0 0 6px var(--a1); animation: gf-blink-slow 1.1s steps(1) infinite; }
.aga-gname[data-g="text-adventure"] .aga-gname__fx b:nth-child(1) { left: 0; right: 0; top: 100%; height: .35em; background: linear-gradient(180deg, transparent, rgba(124, 255, 154, .2), transparent); }
.aga-gname[data-g="text-adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t { animation: gf-type .9s steps(16, end) both; }
.aga-gname[data-g="text-adventure"]:is(.is-lit, :has(a:focus-visible)) { animation: gf-crt .5s steps(1) both; }
.aga-gname[data-g="text-adventure"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-rollbar 1s linear .1s both; }
@keyframes gf-blink-slow { 50% { opacity: 0; } }
@keyframes gf-type { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes gf-crt { 0% { filter: brightness(1.8); } 8% { filter: brightness(.7); } 16% { filter: brightness(1.25); } 24%, 100% { filter: none; } }
@keyframes gf-rollbar { 0% { top: 100%; } 100% { top: -.4em; } }
.aga-gname[data-g="visual-novel"] { --a1: #ff9fcf; --a2: #fff0f6; --r: .5em; --slot-r: .75em; --plate: linear-gradient(180deg, rgba(64, 24, 52, .94), rgba(30, 10, 26, .94)); --edge: rgba(255, 159, 207, .5); --plate-shadow: inset 0 0 0 2px rgba(20, 6, 16, .9), inset 0 0 0 3px rgba(255, 240, 246, .26), inset 0 1px 14px rgba(255, 159, 207, .12), 0 1px 0 rgba(0, 0, 0, .5); }
.aga-gname[data-g="visual-novel"]::before { --ang: 0deg; inset: -1px; border-radius: inherit; padding: 1.5px; opacity: 0; background: conic-gradient(from var(--ang), transparent 0 62%, var(--a2) 74%, var(--a1) 84%, transparent 95%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; }
.aga-gname[data-g="visual-novel"]::after { right: .32em; bottom: .28em; width: 0; height: 0; border: .2em solid transparent; border-top: .24em solid var(--a2); opacity: .55; }
.aga-gname[data-g="visual-novel"] .aga-gname__fx b:nth-child(1) { --r0: 20deg; top: -.2em; right: 18%; width: .36em; height: .36em; background: linear-gradient(135deg, #fff6fa, var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-petal 1.7s ease-in 0s both; }
.aga-gname[data-g="visual-novel"] .aga-gname__fx b:nth-child(2) { --r0: -30deg; top: -.3em; right: 42%; width: .3em; height: .3em; background: linear-gradient(135deg, #fff6fa, var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-petal 1.7s ease-in .25s both; }
.aga-gname[data-g="visual-novel"] .aga-gname__fx b:nth-child(3) { --r0: 50deg; top: -.25em; right: 66%; width: .4em; height: .4em; background: linear-gradient(135deg, #fff6fa, var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-petal 1.7s ease-in .12s both; }
.aga-gname[data-g="visual-novel"] .aga-gname__fx b:nth-child(4) { --r0: 0deg; top: -.3em; right: 84%; width: .28em; height: .28em; background: linear-gradient(135deg, #fff6fa, var(--a1)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 10C1.2 6.8 1.3 2.6 4 .4L5 1.8 6 .4C8.7 2.6 8.8 6.8 5 10Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-petal 1.7s ease-in .4s both; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible))::before { animation: gf-ring 1.6s linear both; }
.aga-gname[data-g="visual-novel"]:is(.is-lit, :has(a:focus-visible))::after { animation: gf-next 1.2s ease-in-out both; }
@keyframes gf-petal { 0% { transform: translate(0, 0) rotate(var(--r0)); opacity: 0; } 12% { opacity: .95; } 40% { transform: translate(-.9em, .7em) rotate(calc(var(--r0) + 90deg)); } 70% { transform: translate(-1.4em, 1.4em) rotate(calc(var(--r0) + 160deg)); opacity: .9; } 100% { transform: translate(-2.4em, 2.2em) rotate(calc(var(--r0) + 260deg)); opacity: 0; } }
@keyframes gf-ring { 0% { --ang: 0deg; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { --ang: 360deg; opacity: 0; } }
@keyframes gf-next { 0%, 100% { transform: none; opacity: .55; } 20%, 60% { transform: translateY(.16em); opacity: 1; } 40%, 80% { transform: none; opacity: 1; } }
.aga-gname[data-g="mystery"] { --a1: #ffd27a; --a2: #8aa2ff; --plate: linear-gradient(180deg, #0e1226, #070913); --edge: rgba(138, 162, 255, .34); }
.aga-gname[data-g="mystery"] .aga-gname__fx { z-index: 4; }
.aga-gname[data-g="mystery"] .aga-gname__fx::before { inset: 0; background: radial-gradient(130% 170% at 50% 50%, transparent 52%, rgba(0, 0, 0, .5)); }
.aga-gname[data-g="mystery"] .aga-gname__fx b:nth-child(1) { left: var(--lx); top: 50%; width: 1.5em; height: 1.5em; margin: -.75em 0 0 -.75em; border-radius: 50%; border: 2px solid var(--a1); background: radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .45), transparent 30%), radial-gradient(circle, rgba(255, 210, 122, .3), rgba(255, 210, 122, .06) 70%); mix-blend-mode: screen; box-shadow: 0 0 12px rgba(255, 210, 122, .45), inset 0 0 8px rgba(255, 210, 122, .4); opacity: 0; }
.aga-gname[data-g="mystery"] .aga-gname__fx b:nth-child(1)::after { left: 88%; top: 88%; width: .5em; height: .14em; border-radius: .07em; background: linear-gradient(90deg, var(--a1), #8a6a2a); transform: rotate(45deg); transform-origin: 0 50%; }
.aga-gname[data-g="mystery"].is-follow .aga-gname__fx b:nth-child(1) { opacity: 1; transition: opacity .2s; }
.aga-gname[data-g="mystery"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx { animation: gf-search 1.7s ease-in-out both; }
.aga-gname[data-g="mystery"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-lens 1.7s ease-in-out both; }
.aga-gname[data-g="mystery"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-glint 1.7s ease-out both; }
@keyframes gf-search { 0% { --lx: -10%; } 45% { --lx: 62%; } 60% { --lx: 55%; } 100% { --lx: 112%; } }
@keyframes gf-lens { 0% { opacity: 0; } 10% { opacity: 1; } 88% { opacity: 1; } 100% { opacity: 0; } }
@keyframes gf-glint { 0%, 100% { filter: none; transform: none; } 12% { filter: brightness(1.8) drop-shadow(0 0 5px hsl(45 100% 70%)); transform: rotate(-12deg) scale(1.12); } 35% { filter: none; transform: none; } }
.aga-gname[data-g="party"] { --a1: #ff6f9a; --a2: #ffcf5a; --slot-t: .3em; --plate: linear-gradient(180deg, #23101e, #11070f); --edge: rgba(255, 111, 154, .36); }
.aga-gname[data-g="party"] .aga-gname__fx::before { left: .2em; right: .2em; top: .04em; height: .42em; transform-origin: 50% 0; opacity: .92; background: repeating-linear-gradient(90deg, #ff6f9a 0.00em 1.49em, #ffcf5a 1.49em 2.98em, #62d6e8 2.98em 4.47em, #b48cff 4.47em 5.96em, #7ee08a 5.96em 7.45em); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 9'%3E%3Cpath d='M0 1.2Q16 3.6 32 1.2' fill='none' stroke='%23000' stroke-width='.9'/%3E%3Cpath d='M9 2.3H23L16 8.8Z'/%3E%3C/svg%3E") 0 0 / 1.49em .42em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 9'%3E%3Cpath d='M0 1.2Q16 3.6 32 1.2' fill='none' stroke='%23000' stroke-width='.9'/%3E%3Cpath d='M9 2.3H23L16 8.8Z'/%3E%3C/svg%3E") 0 0 / 1.49em .42em repeat-x; }
.aga-gname[data-g="party"] .aga-gname__fx::after { inset: 0; transform-origin: .95em 60%; opacity: 0; background: linear-gradient(#ff6f9a, #ff6f9a) 14% 28% / 4px 7px no-repeat, linear-gradient(#ffcf5a, #ffcf5a) 26% 82% / 6px 3px no-repeat, linear-gradient(#62d6e8, #62d6e8) 40% 22% / 3px 6px no-repeat, linear-gradient(#b48cff, #b48cff) 52% 88% / 5px 3px no-repeat, linear-gradient(#7ee08a, #7ee08a) 63% 30% / 4px 4px no-repeat, linear-gradient(#ff6f9a, #ff6f9a) 74% 74% / 6px 3px no-repeat, linear-gradient(#ffcf5a, #ffcf5a) 86% 36% / 3px 6px no-repeat, linear-gradient(#62d6e8, #62d6e8) 92% 84% / 4px 4px no-repeat, linear-gradient(#b48cff, #b48cff) 33% 52% / 3px 3px no-repeat, linear-gradient(#7ee08a, #7ee08a) 58% 58% / 4px 3px no-repeat, linear-gradient(#ff6f9a, #ff6f9a) 80% 56% / 3px 5px no-repeat, linear-gradient(#ffcf5a, #ffcf5a) 8% 64% / 4px 3px no-repeat; }
.aga-gname[data-g="party"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-flutter 1.3s ease-in-out both; }
.aga-gname[data-g="party"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-confetti 1.2s cubic-bezier(.1,.8,.3,1) .1s both; }
.aga-gname[data-g="party"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-pop .6s ease-out both; }
@keyframes gf-flutter { 0%, 100% { transform: none; } 18% { transform: rotate(1.6deg) skewX(5deg); } 40% { transform: rotate(-1.3deg) skewX(-4deg); } 62% { transform: rotate(.9deg) skewX(2.5deg); } 82% { transform: rotate(-.4deg); } }
@keyframes gf-confetti { 0% { transform: scale(.1) rotate(-25deg); opacity: 1; } 70% { opacity: 1; } 100% { transform: scale(1.12) rotate(6deg); opacity: 0; } }
@keyframes gf-pop { 0%, 100% { transform: none; } 20% { transform: rotate(-18deg) scale(.88); } 45% { transform: rotate(10deg) scale(1.15); } }
.aga-gname[data-g="comedy"] { --a1: #ffe066; --a2: #ff7a59; --r: .9em; --pad-l: .62em; --pad-r: .8em; --below: .42em; --plate: radial-gradient(circle, rgba(255, 224, 102, .13) 0 1px, transparent 1.4px) 0 0 / 5px 5px, linear-gradient(180deg, #2a2310, #15110a); --edge: #fff1c4; --plate-shadow: 0 2px 0 rgba(0, 0, 0, .5); border-width: 2px; }
.aga-gname[data-g="comedy"]::before { inset: auto; left: 1.05em; bottom: -.46em; width: .66em; height: .5em; z-index: -1; opacity: 1; background: #fff1c4; clip-path: polygon(0 0, 100% 0, 12% 100%); }
.aga-gname[data-g="comedy"]::after { left: calc(1.05em + 3px); bottom: -.32em; width: calc(.66em - 8px); height: calc(.32em + 4px); background: #15110a; clip-path: polygon(0 0, 100% 0, 12% 100%); }
.aga-gname[data-g="comedy"] .aga-gname__fx { overflow: visible; }
.aga-gname[data-g="comedy"] .aga-gname__fx b:nth-child(1) { --b: closest-side; left: -14%; right: -14%; top: -75%; bottom: -75%; background: repeating-conic-gradient(from 8deg, var(--a1) 0 5deg, transparent 5deg 30deg); -webkit-mask: radial-gradient(closest-side, transparent 64%, #000 66% 84%, transparent 86%); mask: radial-gradient(closest-side, transparent 64%, #000 66% 84%, transparent 86%); opacity: 0; }
.aga-gname[data-g="comedy"] .aga-gname__fx b:nth-child(2) { right: -.15em; top: -.55em; width: .5em; height: .7em; transform: scale(0) rotate(-20deg); }
.aga-gname[data-g="comedy"] .aga-gname__fx b:nth-child(2)::before { content: "!"; inset: 0; font: 800 .7em/1 var(--f-ui, sans-serif); color: var(--a2); text-shadow: 0 1px 0 #000; }
.aga-gname[data-g="comedy"]:is(.is-lit, :has(a:focus-visible)) { animation: gf-boing .8s cubic-bezier(.3,1.5,.5,1) both; transform-origin: 1.3em 130%; }
.aga-gname[data-g="comedy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-burst .7s cubic-bezier(.2,.9,.3,1) .1s both; }
.aga-gname[data-g="comedy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-bang .8s cubic-bezier(.3,1.6,.5,1) .15s both; }
.aga-gname[data-g="comedy"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-tilt .8s ease-in-out both; }
@keyframes gf-boing { 0% { transform: none; } 25% { transform: scale(1.09, .88); } 50% { transform: scale(.96, 1.06); } 75% { transform: scale(1.02, .98); } 100% { transform: none; } }
@keyframes gf-burst { 0% { opacity: 0; transform: scale(.75); } 30% { opacity: 1; } 100% { opacity: 0; transform: scale(1.18); } }
@keyframes gf-bang { 0% { transform: scale(0) rotate(-20deg); opacity: 1; } 60% { transform: scale(1.25) rotate(8deg); opacity: 1; } 100% { transform: scale(1) rotate(0); opacity: 0; } }
@keyframes gf-tilt { 0%, 100% { transform: none; } 30% { transform: rotate(-16deg); } 65% { transform: rotate(10deg); } }
.aga-gname[data-g="sci-fi"] { --a1: #5ff0ff; --a2: #ff4fb8; --gn-ink: #d8fdff; --plate: linear-gradient(180deg, rgba(8, 40, 52, .92), rgba(3, 15, 22, .92)); --edge: rgba(95, 240, 255, .38); }
.aga-gname[data-g="sci-fi"]::before { inset: -3px; opacity: .55; background: var(--a1); -webkit-mask: linear-gradient(#000 0 0) left top / 7px 1.5px no-repeat, linear-gradient(#000 0 0) left top / 1.5px 7px no-repeat, linear-gradient(#000 0 0) right top / 7px 1.5px no-repeat, linear-gradient(#000 0 0) right top / 1.5px 7px no-repeat, linear-gradient(#000 0 0) left bottom / 7px 1.5px no-repeat, linear-gradient(#000 0 0) left bottom / 1.5px 7px no-repeat, linear-gradient(#000 0 0) right bottom / 7px 1.5px no-repeat, linear-gradient(#000 0 0) right bottom / 1.5px 7px no-repeat; mask: linear-gradient(#000 0 0) left top / 7px 1.5px no-repeat, linear-gradient(#000 0 0) left top / 1.5px 7px no-repeat, linear-gradient(#000 0 0) right top / 7px 1.5px no-repeat, linear-gradient(#000 0 0) right top / 1.5px 7px no-repeat, linear-gradient(#000 0 0) left bottom / 7px 1.5px no-repeat, linear-gradient(#000 0 0) left bottom / 1.5px 7px no-repeat, linear-gradient(#000 0 0) right bottom / 7px 1.5px no-repeat, linear-gradient(#000 0 0) right bottom / 1.5px 7px no-repeat; }
.aga-gname[data-g="sci-fi"]::after { left: 16%; right: 16%; top: 100%; height: .38em; z-index: -1; background: linear-gradient(180deg, rgba(95, 240, 255, .2), transparent); clip-path: polygon(0 0, 100% 0, 64% 100%, 36% 100%); opacity: .7; }
.aga-gname[data-g="sci-fi"] .aga-gname__t { text-shadow: 0 0 10px rgba(95, 240, 255, .35); }
.aga-gname[data-g="sci-fi"] .aga-gname__fx::before { inset: 0; background: repeating-linear-gradient(180deg, rgba(95, 240, 255, .1) 0 1px, transparent 1px 3px) 0 0 / 100% 3px; }
.aga-gname[data-g="sci-fi"] .aga-gname__fx { z-index: 4; }
.aga-gname[data-g="sci-fi"] .aga-gname__fx b:nth-child(1) { top: 0; bottom: 0; left: 0; width: .55em; margin-left: -.55em; background: linear-gradient(90deg, transparent, rgba(95, 240, 255, .5), rgba(255, 255, 255, .75) 60%, transparent); mix-blend-mode: screen; opacity: 0; }
.aga-gname[data-g="sci-fi"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-beam 1s cubic-bezier(.5,0,.5,1) both; }
.aga-gname[data-g="sci-fi"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-roll 1s linear both; }
.aga-gname[data-g="sci-fi"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t { animation: gf-chroma 1.1s steps(1) both; }
.aga-gname[data-g="sci-fi"]:is(.is-lit, :has(a:focus-visible))::before { animation: gf-holo-b 1s steps(1) both; }
.aga-gname[data-g="sci-fi"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-orbit 1.2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes gf-beam { 0% { left: 0; opacity: 1; } 100% { left: calc(100% + .55em); opacity: 1; } }
@keyframes gf-roll { to { background-position: 0 -12px; } }
@keyframes gf-chroma { 0%, 100% { text-shadow: 0 0 10px rgba(95, 240, 255, .35); opacity: 1; } 8% { text-shadow: -.06em 0 rgba(255, 79, 184, .8), .06em 0 rgba(95, 240, 255, .8); opacity: .7; } 14% { opacity: 1; } 40% { text-shadow: .04em 0 rgba(255, 79, 184, .7), -.04em 0 rgba(95, 240, 255, .7); } 46% { text-shadow: 0 0 10px rgba(95, 240, 255, .35); } }
@keyframes gf-holo-b { 0%, 100% { opacity: .55; } 10% { opacity: 1; } 16% { opacity: .3; } 26% { opacity: 1; } }
@keyframes gf-orbit { from { transform: rotate(0); } to { transform: rotate(120deg); } }
.aga-gname[data-g="survival"] { --a1: #ff8a3c; --a2: #ffd36b; --plate: linear-gradient(180deg, #1f0f07, #110703); --edge: rgba(255, 138, 60, .36); }
.aga-gname[data-g="survival"] .aga-gname__fx::before { left: -10%; right: -10%; bottom: -60%; height: 120%; transform-origin: 50% 100%; opacity: .55; background: radial-gradient(50% 50% at 50% 100%, rgba(255, 120, 40, .34), rgba(255, 80, 20, .1) 55%, transparent 75%); }
.aga-gname[data-g="survival"] .aga-gname__fx::after { inset: 0; background: radial-gradient(circle at 22% 86%, rgba(255, 170, 80, .8) 0 1.2px, transparent 2px), radial-gradient(circle at 71% 90%, rgba(255, 170, 80, .7) 0 1px, transparent 1.8px); }
.aga-gname[data-g="survival"] .aga-gname__fx b:nth-child(1) { --sx: .15em; --ex: -.1em; left: 16%; bottom: -.1em; width: .15em; height: .15em; border-radius: 50%; background: radial-gradient(circle, #fff3c4, var(--a2) 40%, var(--a1) 70%, transparent 72%); opacity: 0; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-ember 1.3s ease-out 0s both; }
.aga-gname[data-g="survival"] .aga-gname__fx b:nth-child(2) { --sx: -.2em; --ex: .12em; left: 34%; bottom: -.1em; width: .12em; height: .12em; border-radius: 50%; background: radial-gradient(circle, #fff3c4, var(--a2) 40%, var(--a1) 70%, transparent 72%); opacity: 0; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-ember 1.6s ease-out .2s both; }
.aga-gname[data-g="survival"] .aga-gname__fx b:nth-child(3) { --sx: .1em; --ex: .28em; left: 52%; bottom: -.1em; width: .17em; height: .17em; border-radius: 50%; background: radial-gradient(circle, #fff3c4, var(--a2) 40%, var(--a1) 70%, transparent 72%); opacity: 0; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-ember 1.2s ease-out .1s both; }
.aga-gname[data-g="survival"] .aga-gname__fx b:nth-child(4) { --sx: -.12em; --ex: -.25em; left: 68%; bottom: -.1em; width: .12em; height: .12em; border-radius: 50%; background: radial-gradient(circle, #fff3c4, var(--a2) 40%, var(--a1) 70%, transparent 72%); opacity: 0; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-ember 1.5s ease-out .32s both; }
.aga-gname[data-g="survival"] .aga-gname__fx b:nth-child(5) { --sx: .2em; --ex: .05em; left: 84%; bottom: -.1em; width: .14em; height: .14em; border-radius: 50%; background: radial-gradient(circle, #fff3c4, var(--a2) 40%, var(--a1) 70%, transparent 72%); opacity: 0; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(5) { animation: gf-ember 1.4s ease-out .18s both; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-fire 1.7s linear both; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t { animation: gf-warm 1.7s ease-in-out both; }
.aga-gname[data-g="survival"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-flame 1.6s ease-in-out both; }
@keyframes gf-fire { 0% { opacity: .55; transform: none; } 8% { opacity: 1; transform: scaleY(1.15); } 14% { opacity: .75; } 22% { opacity: 1; transform: scaleY(1.28); } 31% { opacity: .8; transform: scaleY(1.05); } 44% { opacity: 1; transform: scaleY(1.22); } 60% { opacity: .85; } 75% { opacity: .95; transform: scaleY(1.1); } 100% { opacity: .55; transform: none; } }
@keyframes gf-ember { 0% { transform: none; opacity: 0; } 12% { opacity: 1; } 50% { transform: translate(var(--sx), -1em); } 100% { transform: translate(var(--ex), -2.1em) scale(.4); opacity: 0; } }
@keyframes gf-warm { 0%, 100% { text-shadow: none; } 30%, 70% { text-shadow: 0 0 10px rgba(255, 138, 60, .55); } }
@keyframes gf-flame { 0%, 100% { transform: none; } 20% { transform: scale(1.12, 1.18) skewX(-4deg); filter: drop-shadow(0 0 5px hsl(28 100% 55%)); } 40% { transform: scale(.95, 1.04) skewX(3deg); } 60% { transform: scale(1.08, 1.12) skewX(-2deg); filter: drop-shadow(0 0 4px hsl(28 100% 55%)); } }
.aga-gname[data-g="racing"] { --a1: #ff3b3b; --a2: #ffffff; --a3: #ffd23f; --slot-r: 1.1em; --pad-l: .62em; --plate: linear-gradient(180deg, #2a0d0d, #150606); --edge: rgba(255, 59, 59, .42); transform: skewX(-12deg); }
.aga-gname[data-g="racing"] .aga-gname__sig { transform: skewX(12deg); }
.aga-gname[data-g="racing"] .aga-gname__t { --cs: 12deg; transform: skewX(var(--cs)); }
.aga-gname[data-g="racing"] .aga-gname__fx::before { left: 0; top: 0; bottom: 0; width: .5em; background: linear-gradient(90deg, rgba(255, 59, 59, .75) 0 46%, transparent 46% 58%, rgba(255, 255, 255, .55) 58% 72%, transparent 72% 82%, rgba(255, 210, 63, .6) 82% 92%, transparent 92%); }
.aga-gname[data-g="racing"] .aga-gname__fx::after { left: .5em; right: .4em; bottom: .12em; height: 2px; background: linear-gradient(90deg, var(--a1), var(--a3) 60%, transparent); }
.aga-gname[data-g="racing"] .aga-gname__fx b:nth-child(1) { right: .3em; top: 50%; width: .72em; height: .54em; margin-top: -.32em; background: conic-gradient(#fff 0 25%, #1a1a1a 0 50%, #fff 0 75%, #1a1a1a 0) 0 0 / .18em .18em; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 9'%3E%3Cpath d='M0 1C3 0 5 2 8 1 9.5.5 11 .6 12 1V8C11 7.6 9.5 7.5 8 8 5 9 3 7 0 8Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 9'%3E%3Cpath d='M0 1C3 0 5 2 8 1 9.5.5 11 .6 12 1V8C11 7.6 9.5 7.5 8 8 5 9 3 7 0 8Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat; transform: skewX(12deg); transform-origin: 0 50%; }
.aga-gname[data-g="racing"] .aga-gname__fx b:nth-child(2) { right: calc(.3em + .72em - 1px); top: 50%; width: 1.5px; height: .8em; margin-top: -.32em; background: #ddd; transform: skewX(12deg); }
.aga-gname[data-g="racing"] .aga-gname__fx b:nth-child(3) { top: 0; bottom: 0; left: -40%; width: 40%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .26) 45%, rgba(255, 255, 255, .5) 50%, transparent 60%); }
.aga-gname[data-g="racing"] .aga-gname__fx b:nth-child(4) { inset: 0; opacity: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45)) 110% 22% / 2.4em 1px no-repeat, linear-gradient(90deg, transparent, rgba(255, 255, 255, .3)) 130% 48% / 3.2em 1px no-repeat, linear-gradient(90deg, transparent, rgba(255, 255, 255, .5)) 120% 74% / 1.8em 1px no-repeat; }
.aga-gname[data-g="racing"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-gloss .8s cubic-bezier(.4,0,.2,1) both; }
.aga-gname[data-g="racing"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-speed .8s cubic-bezier(.4,0,.6,1) both; }
.aga-gname[data-g="racing"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-flagwave .9s ease-in-out .2s both; }
.aga-gname[data-g="racing"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__t { animation: gf-lean .8s cubic-bezier(.3,.7,.3,1) both; }
@keyframes gf-gloss { from { left: -40%; } to { left: 110%; } }
@keyframes gf-speed { 0% { opacity: 1; background-position: 110% 22%, 130% 48%, 120% 74%; } 100% { opacity: 0; background-position: -60% 22%, -80% 48%, -50% 74%; } }
@keyframes gf-flagwave { 0%, 100% { transform: skewX(12deg); } 25% { transform: skewX(12deg) skewY(-10deg) scaleX(.92); } 50% { transform: skewX(12deg) skewY(8deg); } 75% { transform: skewX(12deg) skewY(-5deg); } }
@keyframes gf-lean { 0%, 100% { transform: skewX(var(--cs, 0deg)); } 30% { transform: skewX(calc(var(--cs, 0deg) - 10deg)) translateX(.06em); text-shadow: -.1em 0 rgba(255, 255, 255, .22), -.2em 0 rgba(255, 255, 255, .1); } 70% { transform: skewX(calc(var(--cs, 0deg) - 3deg)); } }
.aga-gname[data-g="mmo"] { --a1: #9b8cff; --a2: #6fe08a; --slot-b: .26em; --slot-r: 1.15em; --plate: linear-gradient(180deg, #14102a, #0a0816); --edge: rgba(155, 140, 255, .38); }
.aga-gname[data-g="mmo"] .aga-gname__fx { --hp: 100%; --hplag: 100%; }
.aga-gname[data-g="mmo"] .aga-gname__fx::before { left: .5em; right: .5em; bottom: .1em; height: .16em; border-radius: .1em; background: linear-gradient(90deg, #ff5d6c 0 var(--hplag), rgba(255, 255, 255, .08) var(--hplag)); }
.aga-gname[data-g="mmo"] .aga-gname__fx::after { left: .5em; right: .5em; bottom: .1em; height: .16em; border-radius: .1em; background: linear-gradient(90deg, #3fcf6e, #8ff0a6) 0 0 / var(--hp) 100% no-repeat; -webkit-mask: repeating-linear-gradient(90deg, #000 0 calc(10% - 1px), transparent calc(10% - 1px) 10%); mask: repeating-linear-gradient(90deg, #000 0 calc(10% - 1px), transparent calc(10% - 1px) 10%); }
.aga-gname[data-g="mmo"] .aga-gname__fx b:nth-child(1) { right: calc(.42em + 0.68em); top: 50%; width: .28em; height: .28em; margin-top: -.24em; background: #5fa8ff; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 11'%3E%3Cpath d='M5 .6 9.2 2.2V5.4C9.2 8 7.2 9.6 5 10.6 2.8 9.6.8 8 .8 5.4V2.2Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 11'%3E%3Cpath d='M5 .6 9.2 2.2V5.4C9.2 8 7.2 9.6 5 10.6 2.8 9.6.8 8 .8 5.4V2.2Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: .55; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-role 1.2s ease-out 0s both; }
.aga-gname[data-g="mmo"] .aga-gname__fx b:nth-child(2) { right: calc(.42em + 0.34em); top: 50%; width: .28em; height: .28em; margin-top: -.24em; background: #6fe08a; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: .55; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-role 1.2s ease-out .15s both; }
.aga-gname[data-g="mmo"] .aga-gname__fx b:nth-child(3) { right: calc(.42em + 0.0em); top: 50%; width: .28em; height: .28em; margin-top: -.24em; background: #ff6b6b; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M9.2.8 9.6 1.2 4.6 6.8 5.8 8 4.9 8.9 3.9 7.9 2.1 9.7 1.1 8.7 2.9 6.9 1.9 5.9 2.8 5 4 6.2Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M9.2.8 9.6 1.2 4.6 6.8 5.8 8 4.9 8.9 3.9 7.9 2.1 9.7 1.1 8.7 2.9 6.9 1.9 5.9 2.8 5 4 6.2Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: .55; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-role 1.2s ease-out .3s both; }
.aga-gname[data-g="mmo"] .aga-gname__fx b:nth-child(4) { left: 34%; bottom: .3em; width: .24em; height: .24em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-heal .7s ease-out 1.05s both; }
.aga-gname[data-g="mmo"] .aga-gname__fx b:nth-child(5) { left: 62%; bottom: .3em; width: .24em; height: .24em; background: var(--a2); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.7.8H6.3V3.7H9.2V6.3H6.3V9.2H3.7V6.3H.8V3.7H3.7Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(5) { animation: gf-heal .7s ease-out 1.2s both; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx { animation: gf-raid 1.9s both; }
.aga-gname[data-g="mmo"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-hop 1.1s cubic-bezier(.3,1.6,.5,1) both; }
@keyframes gf-raid { 0% { --hp: 100%; --hplag: 100%; } 16% { --hp: 36%; --hplag: 100%; } 38% { --hp: 36%; --hplag: 36%; } 52% { --hp: 36%; } 78% { --hp: 100%; --hplag: 100%; } 100% { --hp: 100%; --hplag: 100%; } }
@keyframes gf-role { 0% { opacity: .55; transform: none; } 25% { opacity: 1; transform: scale(1.35); filter: drop-shadow(0 0 4px currentColor); } 100% { opacity: .55; transform: none; } }
@keyframes gf-heal { 0% { opacity: 0; transform: none; } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(-.6em) scale(1.2); } }
@keyframes gf-hop { 0%, 100% { transform: none; } 30% { transform: translateY(-.2em); } 55% { transform: none; } 70% { transform: translateY(-.08em); } }
.aga-gname[data-g="card"] { --a1: #ffe39a; --a2: #fff8e1; --plate: linear-gradient(180deg, #221b0c, #110d05) padding-box, linear-gradient(135deg, #7a5a1e, #ffe39a 30%, #8a6a2a 55%, #fff3c4 80%, #7a5a1e) border-box; --edge: transparent; }
.aga-gname[data-g="card"]::before { background: none; }
.aga-gname[data-g="card"] .aga-gname__fx { z-index: 4; }
.aga-gname[data-g="card"] .aga-gname__fx::before { inset: 0; opacity: .6; background: repeating-linear-gradient(115deg, rgba(255, 120, 200, .06) 0 5px, rgba(120, 230, 255, .06) 5px 10px, rgba(255, 240, 120, .06) 10px 15px); }
.aga-gname[data-g="card"] .aga-gname__fx::after { inset: 0; mix-blend-mode: screen; opacity: 0; background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, .55) 48%, transparent 54%) 100% 0 / 300% 100% no-repeat, linear-gradient(115deg, transparent 34%, hsl(330 95% 65% / .5) 40%, hsl(50 95% 65% / .5) 45%, hsl(160 90% 60% / .5) 50%, hsl(220 95% 68% / .5) 55%, transparent 61%) 100% 0 / 300% 100% no-repeat; }
.aga-gname[data-g="card"] .aga-gname__fx b:nth-child(1) { left: 12%; top: 20%; width: .42em; height: .42em; margin: -.21em 0 0 -.21em; background: radial-gradient(circle, #fff, #ffe39a 60%); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="card"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-twinkle .7s ease-out .35s both; }
.aga-gname[data-g="card"] .aga-gname__fx b:nth-child(2) { left: 64%; top: 62%; width: .42em; height: .42em; margin: -.21em 0 0 -.21em; background: radial-gradient(circle, #fff, #ffe39a 60%); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="card"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-twinkle .7s ease-out .55s both; }
.aga-gname[data-g="card"] .aga-gname__fx b:nth-child(3) { left: 88%; top: 24%; width: .42em; height: .42em; margin: -.21em 0 0 -.21em; background: radial-gradient(circle, #fff, #ffe39a 60%); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0C5.6 3.4 6.6 4.4 10 5 6.6 5.6 5.6 6.6 5 10 4.4 6.6 3.4 5.6 0 5 3.4 4.4 4.4 3.4 5 0Z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="card"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-twinkle .7s ease-out .78s both; }
.aga-gname[data-g="card"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-holo 1.3s ease-in-out both; }
.aga-gname[data-g="card"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-fan 1s ease-in-out both; }
@keyframes gf-holo { 0% { opacity: 1; background-position: 100% 0, 112% 0; } 100% { opacity: 1; background-position: 0 0, 12% 0; } }
@keyframes gf-twinkle { 0% { transform: scale(0) rotate(0); opacity: 0; } 40% { transform: scale(1.15) rotate(45deg); opacity: 1; } 100% { transform: scale(0) rotate(90deg); opacity: 0; } }
@keyframes gf-fan { 0%, 100% { transform: none; } 35% { transform: rotate(-14deg) scale(1.1); } 65% { transform: rotate(9deg); } }
.aga-gname[data-g="dating-sim"] { --a1: #ff7aa8; --a2: #ffd3e2; --slot-b: .22em; --plate: linear-gradient(180deg, #2a0f1b, #13060c); --edge: rgba(255, 122, 168, .4); }
.aga-gname[data-g="dating-sim"] .aga-gname__fx::before { inset: 0; background: radial-gradient(60% 120% at .95em 50%, rgba(255, 122, 168, .16), transparent 70%); }
.aga-gname[data-g="dating-sim"] .aga-gname__fx::after { left: .55em; right: .55em; bottom: .1em; height: .12em; border-radius: .1em; background: linear-gradient(90deg, var(--a1), var(--a2)); transform: scaleX(0); transform-origin: 0 50%; }
.aga-gname[data-g="dating-sim"] .aga-gname__fx b:nth-child(1) { left: .6em; top: 40%; width: .38em; height: .38em; background: var(--a1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="dating-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-float 1.4s ease-out .1s both; }
.aga-gname[data-g="dating-sim"] .aga-gname__fx b:nth-child(2) { left: 1em; top: 40%; width: .38em; height: .38em; background: var(--a1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="dating-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-float 1.4s ease-out .4s both; }
.aga-gname[data-g="dating-sim"] .aga-gname__fx b:nth-child(3) { left: .8em; top: 40%; width: .38em; height: .38em; background: var(--a1); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20.5s-7.5-4.6-7.5-10.4A4.2 4.2 0 0 1 12 7.5a4.2 4.2 0 0 1 7.5 2.6c0 5.8-7.5 10.4-7.5 10.4z'/%3E%3C/svg%3E") center / contain no-repeat; opacity: 0; }
.aga-gname[data-g="dating-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-float 1.4s ease-out .7s both; }
.aga-gname[data-g="dating-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-affinity 1.5s cubic-bezier(.3,.7,.2,1) .2s both; }
.aga-gname[data-g="dating-sim"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-beat 1.1s ease-in-out both; }
@keyframes gf-float { 0% { transform: none; opacity: 0; } 20% { opacity: .9; } 100% { transform: translate(.4em, -1.6em) scale(.7); opacity: 0; } }
@keyframes gf-affinity { 0% { transform: scaleX(0); opacity: 1; } 60% { transform: scaleX(.82); opacity: 1; } 100% { transform: scaleX(.82); opacity: 0; } }
@keyframes gf-beat { 0%, 100% { transform: none; } 15% { transform: scale(1.28); } 30% { transform: scale(.96); } 45% { transform: scale(1.2); } 60% { transform: none; } }
.aga-gname[data-g="social-deduction"] { --a1: #e04a5f; --a2: #9db4ff; --slot-r: .8em; --plate: linear-gradient(180deg, #161026, #0a0712); --edge: rgba(157, 180, 255, .34); }
.aga-gname[data-g="social-deduction"] .aga-gname__fx::before { inset: 0; background: radial-gradient(circle at 92% -20%, rgba(157, 180, 255, .25), transparent 45%), radial-gradient(130% 170% at 50% 50%, transparent 55%, rgba(0, 0, 0, .45)); }
.aga-gname[data-g="social-deduction"] .aga-gname__fx b:nth-child(1) { right: .25em; top: .1em; width: .55em; height: .7em; transform: scale(0); }
.aga-gname[data-g="social-deduction"] .aga-gname__fx b:nth-child(1)::before { content: "?"; inset: 0; font: 800 .62em/1 var(--f-ui, sans-serif); color: var(--a1); text-shadow: 0 0 6px rgba(224, 74, 95, .6); }
.aga-gname[data-g="social-deduction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-glance 1.2s ease-in-out both; }
.aga-gname[data-g="social-deduction"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-stamp 1.2s cubic-bezier(.3,1.6,.5,1) .35s both; }
.aga-gname[data-g="social-deduction"]:is(.is-lit, :has(a:focus-visible)) { animation: gf-accuse 1.2s ease-out .35s both; }
@keyframes gf-glance { 0%, 100% { transform: none; } 18% { transform: translateX(-.1em); } 36% { transform: translateX(.1em); } 54% { transform: translateX(-.06em); } 70% { transform: none; } }
@keyframes gf-stamp { 0% { transform: scale(2.2) rotate(20deg); opacity: 0; } 30% { transform: scale(1) rotate(-6deg); opacity: 1; } 80% { opacity: 1; } 100% { transform: scale(1) rotate(-6deg); opacity: 0; } }
@keyframes gf-accuse { 0%, 100% { border-color: rgba(157, 180, 255, .34); } 15% { border-color: rgba(224, 74, 95, .95); box-shadow: inset 0 0 14px rgba(224, 74, 95, .35); } 60% { border-color: rgba(224, 74, 95, .5); } }
.aga-gname[data-g="open-world"] { --a1: #79d28a; --a2: #ffd27a; --plate: linear-gradient(180deg, #0f1e14, #07110a); --edge: rgba(121, 210, 138, .36); }
.aga-gname[data-g="open-world"] .aga-gname__fx::before { inset: 0; background: linear-gradient(90deg, rgba(121, 210, 138, .55), var(--gilt-hi, #f6dfa4) 50%, rgba(121, 210, 138, .55)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 12' preserveAspectRatio='none'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round' d='M0 10.5 6 7.2 9.5 9 15.5 2.6 20.5 7.8 25 5.6 31 10 37.5 4.4 43 8.6 48 6.5'/%3E%3C/svg%3E") 0 100% / 7em .62em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 12' preserveAspectRatio='none'%3E%3Cpath fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round' d='M0 10.5 6 7.2 9.5 9 15.5 2.6 20.5 7.8 25 5.6 31 10 37.5 4.4 43 8.6 48 6.5'/%3E%3C/svg%3E") 0 100% / 7em .62em repeat-x; }
.aga-gname[data-g="open-world"] .aga-gname__fx::after { inset: 0; background: rgba(40, 90, 55, .45); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 12' preserveAspectRatio='none'%3E%3Cpath d='M0 12V9.8L7 6.8 12 9.2 19 5 24 8.4 30 6.2 36 9.4 42 7 48 9V12Z'/%3E%3C/svg%3E") 0 100% / 5em .42em repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 12' preserveAspectRatio='none'%3E%3Cpath d='M0 12V9.8L7 6.8 12 9.2 19 5 24 8.4 30 6.2 36 9.4 42 7 48 9V12Z'/%3E%3C/svg%3E") 0 100% / 5em .42em repeat-x; }
.aga-gname[data-g="open-world"] .aga-gname__fx b:nth-child(1) { right: 18%; bottom: .15em; width: .9em; height: .9em; border-radius: 50%; background: radial-gradient(circle, #fff3c8 0 22%, rgba(255, 190, 90, .45) 40%, transparent 70%); opacity: 0; }
.aga-gname[data-g="open-world"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::before { animation: gf-ridge 1.7s cubic-bezier(.3,.6,.3,1) both; }
.aga-gname[data-g="open-world"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-ridge2 1.7s cubic-bezier(.3,.6,.3,1) both; }
.aga-gname[data-g="open-world"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-sun 1.7s ease-out both; }
@keyframes gf-ridge { from { -webkit-mask-position: 0 100%; mask-position: 0 100%; } to { -webkit-mask-position: -7em 100%; mask-position: -7em 100%; } }
@keyframes gf-ridge2 { from { -webkit-mask-position: 0 100%; mask-position: 0 100%; } to { -webkit-mask-position: -10em 100%; mask-position: -10em 100%; } }
@keyframes gf-sun { 0% { transform: translateY(.6em); opacity: 0; } 40% { opacity: 1; } 100% { transform: translateY(-.5em) scale(1.3); opacity: 0; } }
.aga-gname[data-g="casual"] { --a1: #6fe0e8; --a2: #ffb3d9; --plate: linear-gradient(180deg, #0c1d22, #061013); --edge: rgba(111, 224, 232, .36); }
.aga-gname[data-g="casual"] .aga-gname__fx b:nth-child(1) { left: 18%; bottom: -.6em; width: .42em; height: .42em; border-radius: 50%; border: 1px solid rgba(180, 245, 250, .8); background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .75) 0 12%, transparent 30%); opacity: 0; }
.aga-gname[data-g="casual"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(1) { animation: gf-bubble 1.4s ease-out 0s both; }
.aga-gname[data-g="casual"] .aga-gname__fx b:nth-child(2) { left: 46%; bottom: -.6em; width: .3em; height: .3em; border-radius: 50%; border: 1px solid rgba(180, 245, 250, .8); background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .75) 0 12%, transparent 30%); opacity: 0; }
.aga-gname[data-g="casual"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(2) { animation: gf-bubble 1.4s ease-out .2s both; }
.aga-gname[data-g="casual"] .aga-gname__fx b:nth-child(3) { left: 74%; bottom: -.6em; width: .5em; height: .5em; border-radius: 50%; border: 1px solid rgba(180, 245, 250, .8); background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .75) 0 12%, transparent 30%); opacity: 0; }
.aga-gname[data-g="casual"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(3) { animation: gf-bubble 1.4s ease-out .38s both; }
.aga-gname[data-g="casual"] .aga-gname__fx b:nth-child(4) { left: 60%; bottom: -.6em; width: .22em; height: .22em; border-radius: 50%; border: 1px solid rgba(180, 245, 250, .8); background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .75) 0 12%, transparent 30%); opacity: 0; }
.aga-gname[data-g="casual"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__fx b:nth-child(4) { animation: gf-bubble 1.4s ease-out .55s both; }
.aga-gname[data-g="casual"]:is(.is-lit, :has(a:focus-visible)) .aga-gname__sig { animation: gf-wobble 1s ease-in-out both; }
@keyframes gf-bubble { 0% { transform: none; opacity: 0; } 15% { opacity: 1; } 80% { transform: translateY(-1.7em); opacity: 1; } 100% { transform: translateY(-1.9em) scale(1.6); opacity: 0; } }
@keyframes gf-wobble { 0%, 100% { transform: none; } 25% { transform: scale(1.12, .9); } 50% { transform: scale(.92, 1.1); } 75% { transform: scale(1.04, .97); } }
.aga-gname:not([data-g="fps"], [data-g="shooter"], [data-g="battle-royale"], [data-g="action"], [data-g="rpg"], [data-g="adventure"], [data-g="strategy"], [data-g="simulation"], [data-g="life-sim"], [data-g="sandbox"], [data-g="puzzle"], [data-g="horror"], [data-g="interactive-fiction"], [data-g="text-adventure"], [data-g="visual-novel"], [data-g="mystery"], [data-g="party"], [data-g="sci-fi"], [data-g="survival"], [data-g="racing"], [data-g="mmo"], [data-g="card"], [data-g="comedy"], [data-g="dating-sim"], [data-g="social-deduction"], [data-g="open-world"], [data-g="casual"]) .aga-gname__fx::after { inset: 0; background: linear-gradient(110deg, transparent 42%, rgba(246, 223, 164, .32) 50%, transparent 58%) 100% 0 / 300% 100% no-repeat; }
.aga-gname:not([data-g="fps"], [data-g="shooter"], [data-g="battle-royale"], [data-g="action"], [data-g="rpg"], [data-g="adventure"], [data-g="strategy"], [data-g="simulation"], [data-g="life-sim"], [data-g="sandbox"], [data-g="puzzle"], [data-g="horror"], [data-g="interactive-fiction"], [data-g="text-adventure"], [data-g="visual-novel"], [data-g="mystery"], [data-g="party"], [data-g="sci-fi"], [data-g="survival"], [data-g="racing"], [data-g="mmo"], [data-g="card"], [data-g="comedy"], [data-g="dating-sim"], [data-g="social-deduction"], [data-g="open-world"], [data-g="casual"]):is(.is-lit, :has(a:focus-visible)) .aga-gname__fx::after { animation: gf-sheen 1.1s ease-in-out both; }
@keyframes gf-sheen { from { background-position: 100% 0; } to { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) {
	.aga-gname, .aga-gname *, .aga-gname::before, .aga-gname::after, .aga-gname *::before, .aga-gname *::after { animation: none !important; transition: none !important; }
}

/* ---------- Legend + FAQ ---------- */
.aga-legend { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(28px, 4vw, 48px); border-top: 1px solid var(--line); }
.aga-legend__intro { max-width: 44rem; color: var(--mist); margin: 0 0 22px; }
.aga-legend__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1px; margin: 0; background: var(--line); border: 1px solid var(--line); }
.aga-legend__list > div { padding: 18px 20px; background: var(--page); }
.aga-legend__list dt { margin: 0 0 4px; font: 600 1.18rem/1.2 var(--f-serif); color: var(--acc-2); }
body.aga-l-assets .aga-legend__list dt { color: #6b4f16; }
.aga-legend__list dd { margin: 0; font-size: .96rem; line-height: 1.55; color: color-mix(in srgb, var(--ink) 80%, transparent); }
.aga-faq { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(56px, 8vw, 96px); max-width: 920px; }
.aga-faq__item { border-bottom: 1px solid var(--line); }
.aga-faq__item summary { position: relative; padding: 18px 40px 18px 0; cursor: pointer; list-style: none; font: 600 1.22rem/1.3 var(--f-serif); color: var(--ink); }
.aga-faq__item summary::-webkit-details-marker { display: none; }
.aga-faq__item summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 11px; height: 11px; margin-top: -8px; border-right: 1.5px solid var(--acc-2); border-bottom: 1.5px solid var(--acc-2); transform: rotate(45deg); transition: transform .4s var(--ease-out); }
.aga-faq__item[open] summary::after { transform: rotate(225deg); margin-top: -2px; }
.aga-faq__a p { margin: 0 0 20px; max-width: 46rem; line-height: 1.65; color: color-mix(in srgb, var(--ink) 84%, transparent); }
.aga-faq__item[open] .aga-faq__a { animation: aga-open .5s var(--ease-out); }
@keyframes aga-open { from { opacity: 0; transform: translateY(-6px); } }

/* ---------- Single game ---------- */
.aga-game__head { position: relative; isolation: isolate; min-height: 460px; padding: calc(var(--hdr) + 40px) 0 44px; overflow: hidden; display: flex; align-items: flex-end; }
.aga-game__cover { position: absolute; inset: 0; z-index: -2; }
.aga-game__cover img, .aga-game__cover .aga-plate { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.aga-game__cover .aga-plate b { font-size: clamp(10rem, 30vw, 22rem); opacity: .25; }
.aga-game__veil { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, .3), var(--page) 96%), radial-gradient(60% 80% at 0% 100%, var(--page), transparent); }
.aga-game__headin { width: 100%; }
.aga-game__head .aga-gname { --gn-size: clamp(2.2rem, 5vw, 4rem); --pad-y: .1em; --pad-l: .35em; --pad-r: .4em; --tk: 12px; }
.aga-game__by { margin: 14px 0 6px; font: italic 500 1.15rem var(--f-serif); color: var(--mist); }
.aga-game__lede { max-width: 44rem; margin: 0 0 24px; font-size: clamp(1.08rem, 1.5vw, 1.25rem); line-height: 1.6; }
.aga-game__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.aga-rate { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.aga-rate__label { font: italic 500 1rem var(--f-serif); color: var(--mist); }
.aga-rate__stars { display: flex; }
.aga-rate__stars button { width: 36px; height: 36px; padding: 5px; border: 0; background: none; cursor: pointer; color: rgba(255, 255, 255, .22); transition: color .2s, transform .3s var(--ease-out); }
.aga-rate__stars button svg { width: 100%; height: 100%; }
.aga-rate__stars button.is-on { color: var(--acc-2); filter: drop-shadow(0 0 6px var(--acc)); }
.aga-rate__stars button:hover { transform: scale(1.15) rotate(-6deg); }
.aga-rate.is-done .aga-rate__stars button { cursor: default; }
.aga-rate__now { font-size: .9rem; color: var(--mist); }
.aga-game__grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: clamp(24px, 4vw, 56px); padding-top: 20px; padding-bottom: 40px; }
.aga-prose { font-size: 1.1rem; line-height: 1.75; color: color-mix(in srgb, var(--ink) 90%, transparent); max-width: 44rem; }
.aga-prose h2 { font: 600 1.7rem/1.2 var(--f-serif) !important; margin: 2.2rem 0 .8rem; color: var(--ink); scroll-margin-top: calc(var(--hdr) + 20px); }
.aga-prose a { color: var(--acc-2) !important; }
.aga-prose ul { padding-left: 1.2em; }
.aga-facts { align-self: start; position: sticky; top: calc(var(--hdr) + 20px); padding: 22px 24px; background: var(--card); border: 1px solid var(--line); }
.aga-facts__t { margin: 0 0 12px !important; font: 600 1.3rem var(--f-serif) !important; color: var(--acc-2) !important; }
.aga-facts dl { margin: 0; }
.aga-facts dl > div, .aga-facts--flat > div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; padding: 9px 0; border-top: 1px solid var(--line); font-size: .95rem; }
.aga-facts dt { color: var(--mist); }
.aga-facts dd { margin: 0; color: var(--ink); }
.aga-facts__note { margin: 14px 0 0; font-size: .85rem; color: var(--mist); }
.aga-facts--flat { position: static; padding: 0; background: none; border: 0; margin-top: 22px; }
.aga-related { padding-top: 24px; padding-bottom: 32px; }

/* ---------- Assets (light, the Null Lattice) ---------- */
body.aga-l-assets .aga-main { --ink: #141210; --mist: #5f594f; }
body.aga-l-assets .aga-lib, body.aga-l-assets .aga-legend, body.aga-l-assets .aga-faq, body.aga-l-assets .aga-asset {
	background-image: linear-gradient(rgba(20, 18, 16, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(20, 18, 16, .035) 1px, transparent 1px); background-size: 48px 48px; }
.aga-typerail { display: flex; gap: 8px; margin: 0 0 18px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.aga-typerail::-webkit-scrollbar { display: none; }
.aga-typerail a { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 10px 12px; border: 1px solid var(--line); background: var(--card); color: var(--ink) !important; text-decoration: none; font-weight: 500; transition: border-color .25s, background .25s, transform .3s var(--ease-out); }
.aga-typerail svg { width: 22px; height: 22px; color: #8a6a26; }
.aga-typerail small { font-size: .74rem; color: var(--mist); }
.aga-typerail a:hover { transform: translateY(-2px); border-color: #c9a24c; }
.aga-typerail a[aria-current] { background: #141210; color: #f6efe0 !important; border-color: #141210; }
.aga-typerail a[aria-current] svg { color: #e5c574; }
.aga-masonry { columns: 4 250px; column-gap: 16px; }
.aga-masonry--row { columns: 3 240px; }
.aga-acard { break-inside: avoid; margin: 0 0 16px; }
.aga-acard__link { display: block; background: var(--card); border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; transition: transform .45s var(--ease-out), box-shadow .45s; }
.aga-acard__link:hover { transform: translateY(-4px); box-shadow: 0 24px 40px rgba(20, 18, 16, .14); }
.aga-acard__art { position: relative; display: block; aspect-ratio: 1 / var(--ar, 1); overflow: hidden; background: #0d0c0b; }
.aga-acard__art img { width: 100%; height: 100%; object-fit: cover; }
.aga-acard[data-px] .aga-acard__art img, .aga-asset__art[data-px] img { image-rendering: pixelated; }
.aga-asset__art model-viewer { display: block; width: 100%; aspect-ratio: 4 / 3; background: #f3f2f5; border-radius: inherit; --poster-color: transparent; }
.aga-aplate { position: absolute; inset: 0; display: grid; place-items: center;
	background: radial-gradient(70% 60% at 50% 45%, #2b261d, #0b0a09 75%), #0b0a09; }
.aga-aplate::before { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(201, 162, 76, .35); background: linear-gradient(rgba(201, 162, 76, .08) 1px, transparent 1px) 0 0 / 22px 22px, linear-gradient(90deg, rgba(201, 162, 76, .08) 1px, transparent 1px) 0 0 / 22px 22px; }
.aga-aplate svg { position: relative; width: 34%; height: 34%; color: #e5c574; filter: drop-shadow(0 0 18px rgba(229, 197, 116, .55)); transition: transform 1s var(--ease-out); }
.aga-acard__link:hover .aga-aplate svg { transform: rotate(-8deg) scale(1.1); }
.aga-aplate[data-type="textures"] { background: repeating-conic-gradient(#1a1712 0 25%, #100e0b 0 50%) 0 0 / 28px 28px; }
.aga-aplate[data-type="music"], .aga-aplate[data-type="sound-effects"] { background: radial-gradient(circle at 50% 50%, #2b2414, #0b0a09 70%); }
.aga-aplate--xl { position: relative; aspect-ratio: 4 / 3; }
.aga-lic { position: absolute; left: 10px; top: 10px; padding: 3px 8px; font: 700 .72rem/1.2 var(--f-ui); letter-spacing: .04em; color: #141210; background: #f2dc9a; }
.aga-lic[data-l="cc0"] { background: #c9f2c7; }
.aga-lic[data-l="cc-by"] { background: #cfe3ff; }
.aga-lic[data-l="mixed"] { background: #ffe0c2; }
.aga-acard__body { display: grid; gap: 2px; padding: 12px 14px 14px; }
.aga-acard__title { font: 700 1.12rem/1.2 var(--f-display); }
.aga-acard__by { font: italic 500 .95rem var(--f-serif); color: var(--mist); }
.aga-acard__types { font-size: .8rem; color: var(--mist); }
.aga-asset { padding: calc(var(--hdr) + 32px) 0 40px; }
.aga-asset__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.aga-asset__art { border: 1px solid var(--line); background: #0b0a09; }
.aga-asset__title { margin: 0 0 6px !important; font: 700 clamp(2.2rem, 4.4vw, 3.6rem)/1 var(--f-display) !important; color: #141210 !important; }
.aga-asset__by { margin: 0 0 18px; font: italic 500 1.1rem var(--f-serif); color: var(--mist); }
.aga-asset__lede { font-size: 1.08rem; line-height: 1.6; margin: 18px 0 22px; }
.aga-asset__body { padding-top: 32px; }
.aga-licbox { position: relative; padding: 16px 18px 14px 18px; border: 1px solid #141210; background: #fff; box-shadow: 6px 6px 0 #141210; }
.aga-licbox__k { font: italic 500 .95rem var(--f-serif); color: var(--mist); margin-right: 8px; }
.aga-licbox__v { font: 700 1.25rem var(--f-display); }
.aga-licbox p { margin: 6px 0 0; font-size: .95rem; line-height: 1.5; }
.aga-licbox[data-l="cc0"] { box-shadow: 6px 6px 0 #2d8a3e; }
.aga-licbox[data-l="mixed"] { box-shadow: 6px 6px 0 #c06a1a; }

/* ---------- Rankings (the Drowned Citadel) ---------- */
.aga-boards__stamp { margin: 0; font: italic 500 1rem var(--f-serif); color: var(--mist); }
.aga-tabs { display: flex; gap: 2px; margin: 22px 0 0; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--line); }
.aga-tabs::-webkit-scrollbar { display: none; }
.aga-tabs a { flex: none; position: relative; padding: 12px 16px 14px; color: var(--mist) !important; text-decoration: none; font: 600 1.06rem var(--f-serif); transition: color .25s; }
.aga-tabs a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; background: var(--acc); transform: scaleX(0); transition: transform .45s var(--ease-out); box-shadow: 0 0 12px var(--acc); }
.aga-tabs a:hover { color: var(--ink) !important; }
.aga-tabs a[aria-current] { color: var(--ink) !important; }
.aga-tabs a[aria-current]::after { transform: scaleX(1); }
.aga-board { padding-top: 26px; }
.aga-tabs-js .aga-board:not(.is-on) { display: none; }
.aga-board__t { margin: 0 0 4px !important; font: 700 clamp(1.6rem, 3vw, 2.2rem)/1.1 var(--f-display) !important; color: var(--ink) !important; }
.aga-board__blurb { margin: 0 0 20px; color: var(--mist); max-width: 44rem; }
.aga-ladder { margin: 0; padding: 0; list-style: none; counter-reset: r; }
.aga-rung { position: relative; display: grid; grid-template-columns: 54px 50px 92px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 16px 12px 10px; border-bottom: 1px solid var(--line); transition: background .3s; }
.aga-rung:hover { background: color-mix(in srgb, var(--acc) 6%, transparent); }
.aga-rung__n { font: 700 2rem/1 var(--f-display); color: color-mix(in srgb, var(--ink) 55%, transparent); text-align: center; font-variant-numeric: tabular-nums; }
.aga-rung__mv { display: inline-flex; align-items: center; gap: 3px; font: 700 .8rem var(--f-ui); color: var(--mist); }
.aga-rung__mv svg { width: 10px; height: 10px; }
.aga-rung__mv[data-mv="up"] { color: #5fe39a; }
.aga-rung__mv[data-mv="down"] { color: #ff6b7a; }
.aga-rung__mv[data-mv="down"] svg { transform: rotate(180deg); }
.aga-rung__mv[data-mv="new"] { color: var(--acc); letter-spacing: .04em; }
.aga-rung__art { position: relative; display: block; width: 92px; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.aga-rung__art img { width: 100%; height: 100%; object-fit: cover; }
.aga-rung__art .aga-plate b { font-size: 1.8rem; }
.aga-rung__art .aga-plate::after { inset: 4px; }
.aga-rung__main { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.aga-rung__main .aga-gname { --gn-size: 1.15rem; }
.aga-rung__by { font-size: .88rem; color: var(--mist); }
.aga-rung__val { text-align: right; display: grid; }
.aga-rung__val b { font: 700 1.25rem var(--f-display); color: var(--acc-2); }
.aga-rung__val small { font-size: .75rem; color: var(--mist); }
/* podium: the first three rise out of the water */
.aga-ladder--podium .aga-rung:nth-child(-n+3) { padding-top: 18px; padding-bottom: 18px; background: linear-gradient(90deg, color-mix(in srgb, var(--acc) 12%, transparent), transparent 70%); }
.aga-ladder--podium .aga-rung:nth-child(1) .aga-rung__n { font-size: 3rem; color: #fff; text-shadow: 0 0 22px var(--acc); }
.aga-ladder--podium .aga-rung:nth-child(2) .aga-rung__n, .aga-ladder--podium .aga-rung:nth-child(3) .aga-rung__n { font-size: 2.5rem; color: var(--acc-2); }
.aga-ladder--podium .aga-rung:nth-child(1) .aga-rung__art { width: 120px; }
.aga-ladder--podium .aga-rung:nth-child(1) { grid-template-columns: 54px 50px 120px minmax(0, 1fr) auto; }
.aga-ladder--podium .aga-rung:nth-child(1)::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--acc); box-shadow: 0 0 18px var(--acc); }
.aga-genreboards { padding-top: 20px; padding-bottom: 36px; }
.aga-genreboards__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.aga-gboard { padding: 20px 22px; background: linear-gradient(160deg, hsl(var(--h) 60% 22% / .5), var(--card) 60%); border: 1px solid var(--line); }
.aga-gboard__t { margin: 0 0 12px !important; font: 600 1.25rem/1.2 var(--f-serif) !important; }
.aga-gboard__t a { color: var(--ink) !important; text-decoration: none; }
.aga-gboard ol { margin: 0; padding-left: 1.3em; }
.aga-gboard li { padding: 4px 0; }
.aga-gboard li a { color: var(--ink) !important; text-decoration: none; }
.aga-gboard li::marker { color: var(--acc-2); font-weight: 700; }
.aga-method { padding-top: 28px; padding-bottom: 28px; border-top: 1px solid var(--line); }
.aga-method__steps { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; margin: 18px 0 0; padding: 0; list-style: none; counter-reset: m; }
.aga-method__steps li { position: relative; padding: 18px 20px 18px 56px; background: var(--card); border: 1px solid var(--line); line-height: 1.55; color: color-mix(in srgb, var(--ink) 84%, transparent); counter-increment: m; }
.aga-method__steps li::before { content: counter(m); position: absolute; left: 18px; top: 14px; font: 700 1.7rem/1 var(--f-display); color: var(--acc); }
.aga-method__steps b { color: var(--ink); }

/* ---------- News (the Starlit Mirror Sea) ---------- */
.aga-tabs--topics { margin-bottom: 26px; }
.aga-chron__grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(24px, 4vw, 48px); }
.aga-ngrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.aga-ngrid--3 { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.aga-ncard__link { position: relative; display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 20px 22px 22px; background: var(--card); border: 1px solid var(--line); color: var(--ink) !important; text-decoration: none; transition: border-color .3s, transform .45s var(--ease-out); }
.aga-ncard__link:hover { border-color: color-mix(in srgb, var(--acc-2) 50%, transparent); transform: translateY(-3px); }
.aga-ncard__img { display: block; margin: -20px -22px 8px; aspect-ratio: 16 / 9; overflow: hidden; }
.aga-ncard__img img { width: 100%; height: 100%; object-fit: cover; }
.aga-ncard__meta { display: flex; gap: 12px; align-items: center; font-size: .82rem; color: var(--mist); }
.aga-ncard__cat { color: var(--acc-2); font-weight: 700; letter-spacing: .02em; }
.aga-ncard__title { font: 600 1.38rem/1.2 var(--f-serif); }
.aga-ncard__ex { color: color-mix(in srgb, var(--ink) 75%, transparent); font-size: .96rem; line-height: 1.55; }
.aga-ncard__read { margin-top: auto; font: italic 500 .95rem var(--f-serif); color: var(--mist); }
.aga-ncard--lead { grid-column: 1 / -1; }
.aga-ncard--lead .aga-ncard__link { padding: clamp(24px, 4vw, 44px); background: radial-gradient(90% 120% at 100% 0%, rgba(227, 183, 102, .16), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgba(120, 90, 200, .14), transparent 60%), var(--card); }
.aga-ncard--lead .aga-ncard__title { font-size: clamp(1.8rem, 3.4vw, 2.7rem); line-height: 1.08; max-width: 22ch; }
.aga-ncard--lead .aga-ncard__ex { font-size: 1.1rem; max-width: 44rem; }
.aga-chron__side { display: grid; gap: 14px; align-content: start; }
.aga-side__t { margin: 0 !important; font: 600 1.3rem var(--f-serif) !important; color: var(--acc-2) !important; }
.aga-side__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.aga-side__list li { display: grid; gap: 3px; justify-items: start; }
.aga-side__list .aga-gname { --gn-size: 1.02rem; }
.aga-side__list small { color: var(--mist); font-size: .82rem; }
.aga-side__card { margin-top: 10px; padding: 20px; border: 1px solid var(--line); background: var(--card); }
.aga-side__card p { font-size: .95rem; color: var(--mist); }
.aga-standards { padding-top: 28px; padding-bottom: 72px; border-top: 1px solid var(--line); }
.aga-standards__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.aga-standards__cols p { margin: 0; line-height: 1.6; color: color-mix(in srgb, var(--ink) 80%, transparent); }
.aga-standards__cols b { display: block; margin-bottom: 4px; font: 600 1.2rem var(--f-serif); color: var(--ink); }

/* article */
.aga-article__head { position: relative; isolation: isolate; padding: calc(var(--hdr) + 40px) 0 40px; overflow: hidden; }
.aga-article__sky { position: absolute; inset: 0; z-index: -1; background:
	radial-gradient(1px 1px at 12% 20%, #fff, transparent), radial-gradient(1px 1px at 72% 34%, #fff, transparent), radial-gradient(1.5px 1.5px at 44% 12%, #ffe9b8, transparent), radial-gradient(1px 1px at 88% 70%, #fff, transparent), radial-gradient(1px 1px at 28% 64%, #cfc4ff, transparent),
	radial-gradient(60% 90% at 80% 0%, rgba(227, 183, 102, .16), transparent 70%), linear-gradient(180deg, #0b0812, var(--page)); }
.aga-article__kicker { margin: 0 0 10px; font: 700 .85rem var(--f-ui); letter-spacing: .06em; color: var(--acc-2); }
.aga-article__title { margin: 0 0 16px !important; font: 600 clamp(2.2rem, 4.8vw, 3.6rem)/1.05 var(--f-serif) !important; color: var(--ink) !important; }
.aga-article__stand { font-size: clamp(1.12rem, 1.6vw, 1.3rem); line-height: 1.55; color: color-mix(in srgb, var(--ink) 85%, transparent); margin: 0 0 18px; }
.aga-article__by { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; font-size: .92rem; color: var(--mist); }
.aga-article__grid { display: grid; grid-template-columns: 220px minmax(0, 760px); gap: clamp(24px, 4vw, 56px); justify-content: center; padding-bottom: 40px; }
.aga-article__grid > .aga-article__body:only-child { grid-column: 1 / -1; margin: 0 auto; }
.aga-toc { position: sticky; top: calc(var(--hdr) + 24px); align-self: start; }
.aga-toc__t { margin: 0 0 8px; font: italic 600 1rem var(--f-serif); color: var(--acc-2); }
.aga-toc ol { margin: 0; padding: 0 0 0 14px; border-left: 1px solid var(--line); list-style: none; display: grid; gap: 8px; font-size: .92rem; }
.aga-toc a { color: var(--mist) !important; text-decoration: none; }
.aga-toc a:hover { color: var(--ink) !important; }
.aga-article__body { max-width: none; }
.aga-article__body > p:first-child strong { font-weight: 600; color: var(--ink); }
.aga-author { display: flex; gap: 16px; align-items: center; margin-top: 40px; padding-top: 22px; border-top: 1px solid var(--line); font-size: .95rem; }
.aga-author p { margin: 0; color: var(--mist); }
.aga-author__n { font: 600 1.15rem var(--f-serif); color: var(--ink) !important; }
.aga-author__img { border-radius: 50%; }

/* ---------- Submit + 404 ---------- */
.aga-submit { padding: calc(var(--hdr) + 36px) 0 72px; background: radial-gradient(70% 50% at 100% 0%, rgba(213, 169, 90, .1), transparent 70%); }
.aga-submit__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.aga-submit__title { margin: 0 0 14px !important; font: 700 clamp(2.4rem, 5vw, 4rem)/.95 var(--f-display) !important; color: var(--bone) !important; }
.aga-ticks { margin: 0 0 18px; padding: 0; list-style: none; display: grid; gap: 10px; }
.aga-ticks li { position: relative; padding-left: 28px; line-height: 1.5; color: var(--ash); }
.aga-ticks li::before { content: ""; position: absolute; left: 4px; top: .45em; width: 10px; height: 6px; border-left: 2px solid var(--gilt); border-bottom: 2px solid var(--gilt); transform: rotate(-45deg); }
.aga-submit__note { font-size: .92rem; color: var(--ash); border-left: 2px solid var(--gilt); padding-left: 12px; }
.aga-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; padding: clamp(22px, 3vw, 36px); background: linear-gradient(180deg, rgba(24, 16, 33, .95), rgba(12, 8, 18, .95)); border: 1px solid rgba(213, 169, 90, .3); clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px); }
.aga-field { grid-column: 1 / -1; display: grid; gap: 6px; margin: 0; border: 0; padding: 0; min-width: 0; }
.aga-field--half { grid-column: span 1; }
.aga-field label, .aga-field legend { font: 600 1.02rem var(--f-serif); color: var(--bone); }
.aga-field i { color: var(--ichor); font-style: normal; }
.aga-field input[type="text"], .aga-field input[type="url"], .aga-field input[type="email"], .aga-field textarea {
	width: 100%; padding: 12px 14px !important; background: rgba(7, 5, 11, .7) !important; border: 1px solid rgba(213, 169, 90, .25) !important; border-radius: 0 !important; color: var(--bone) !important; font: 1rem var(--f-ui) !important; transition: border-color .25s, box-shadow .25s; }
.aga-field input:focus, .aga-field textarea:focus { border-color: var(--gilt-hi) !important; box-shadow: 0 0 0 3px rgba(213, 169, 90, .15) !important; outline: none; }
.aga-field small { font-size: .82rem; color: var(--ash); }
.aga-field.is-bad input, .aga-field.is-bad textarea { border-color: var(--ichor) !important; }
.aga-field--radio label { display: inline-flex; gap: 6px; align-items: center; margin-right: 16px; font: 1rem var(--f-ui); color: var(--ash); }
.aga-form__go { grid-column: 1 / -1; justify-self: start; }
.aga-form__msg { grid-column: 1 / -1; margin: 0; padding: 12px 14px; font-size: .98rem; }
.aga-form__msg--ok { background: rgba(113, 192, 143, .14); border: 1px solid rgba(113, 192, 143, .6); color: #c9f2d6; }
.aga-form__msg--err { background: rgba(227, 38, 63, .12); border: 1px solid rgba(227, 38, 63, .6); color: #ffc9d0; }
.aga-hp { position: absolute !important; left: -9999px; }
.aga-lost { min-height: 80vh; display: grid; place-items: center; padding: calc(var(--hdr) + 40px) 0 72px; text-align: center; background: radial-gradient(50% 50% at 50% 40%, rgba(122, 60, 255, .14), transparent 70%); }
.aga-lost__in { display: grid; justify-items: center; gap: 10px; }
.aga-lost__mark { width: 84px; height: 84px; color: var(--gilt); animation: aga-spin 30s linear infinite; }
.aga-lost__t { margin: 0 !important; font: 700 clamp(2.4rem, 6vw, 4.4rem)/1 var(--f-display) !important; }
.aga-lost__roads { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 18px 0 0; padding: 0; list-style: none; }
.aga-lost__roads a { display: inline-flex; gap: 8px; align-items: center; padding: 8px 14px; border: 1px solid rgba(213, 169, 90, .3); color: var(--bone) !important; text-decoration: none; }
.aga-seek--plain { --ground: #120c19; --acc-2: #f6dfa4; --acc: #e3263f; --acc-deep: #57081a; --ink: #ece3d4; --title-glow: rgba(227, 38, 63, .3); margin: 10px 0; }

/* ---------- Responsive ---------- */
@media (max-width: 1023px) {
	.aga-game__grid, .aga-chron__grid, .aga-asset__grid, .aga-submit__grid { grid-template-columns: 1fr; }
	.aga-facts { position: static; }
	.aga-article__grid { grid-template-columns: minmax(0, 1fr); }
	.aga-toc { position: static; }
	.aga-standards__cols { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.aga-filters__sort span { display: none; }
	.aga-filters__sort { flex: 1; }
	.aga-filters select { width: 100%; min-width: 0; }
	.aga-filters__open { display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 16px; border: 1px solid var(--acc-2); background: color-mix(in srgb, var(--acc) 18%, var(--card)); color: var(--ink); font: 700 .95rem var(--f-ui); cursor: pointer; }
	.aga-filters__open b:not(:empty) { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--acc); color: #fff; font-size: .78rem; }
	/* the filter sheet rises from the bottom */
	.aga-sheet { position: fixed; inset: 0; z-index: 950; background: rgba(0, 0, 0, .55); opacity: 0; visibility: hidden; transition: opacity .35s, visibility 0s .35s; }
	.aga-sheet.is-open { opacity: 1; visibility: visible; transition: opacity .35s; }
	.aga-sheet__inner { position: absolute; left: 0; right: 0; bottom: 0; max-height: 82vh; overflow-y: auto; padding: 22px 18px calc(18px + env(safe-area-inset-bottom)); background: var(--page); border-top: 1px solid var(--acc-2); transform: translateY(100%); transition: transform .5s var(--ease-out); overscroll-behavior: contain; }
	.aga-sheet.is-open .aga-sheet__inner { transform: none; }
	.aga-sheet__inner::before { content: ""; justify-self: center; width: 44px; height: 4px; border-radius: 2px; background: var(--line); margin-top: -8px; }
	.aga-chipset legend { float: none; width: auto; padding: 0 0 8px; }
	.aga-chipset__list { margin-left: 0; }
	.aga-sheet__actions { position: sticky; bottom: calc(-18px - env(safe-area-inset-bottom)); display: flex; justify-content: space-between; align-items: center; padding: 12px 0 4px; background: var(--page); }
	body.aga-sheet-open { overflow: hidden; }
	.aga-ggrid { grid-template-columns: 1fr; gap: 14px; }
	.aga-gcard { flex-direction: row; }
	.aga-gcard__art { flex: none; width: 34%; aspect-ratio: auto; }
	.aga-gcard__sum, .aga-gcard .aga-chips { display: none; }
	.aga-gcard__body { padding: 12px 14px; gap: 6px; }
	.aga-gname { --gn-size: 1.12rem; }
	.aga-masonry { columns: 2 140px; column-gap: 10px; }
	.aga-acard { margin-bottom: 10px; }
	.aga-acard__title { font-size: 1rem; }
	.aga-rung { grid-template-columns: 34px minmax(0, 1fr) auto; grid-template-areas: "n main val" "n mv val"; gap: 2px 10px; padding: 12px 6px; }
	.aga-rung__n { grid-area: n; font-size: 1.5rem; }
	.aga-rung__mv { grid-area: mv; }
	.aga-rung__art { display: none; }
	.aga-rung__main { grid-area: main; }
	.aga-rung__val { grid-area: val; }
	.aga-ladder--podium .aga-rung:nth-child(1) { grid-template-columns: 34px minmax(0, 1fr) auto; }
	.aga-ladder--podium .aga-rung:nth-child(1) .aga-rung__n { font-size: 2.2rem; }
	.aga-ladder--podium .aga-rung:nth-child(2) .aga-rung__n, .aga-ladder--podium .aga-rung:nth-child(3) .aga-rung__n { font-size: 1.8rem; }
	.aga-ngrid { grid-template-columns: 1fr; }
	.aga-form { grid-template-columns: 1fr; }
	.aga-field--half { grid-column: 1 / -1; }
	.aga-game__head { min-height: 380px; }
	.aga-rate__stars button { width: 44px; height: 44px; }
	.aga-legend__list { grid-template-columns: 1fr; }
}

/* Lair flashes */
.aga-fx__flash.is-frost { --fo: .55; background: radial-gradient(circle at 50% 40%, #fff, #bff6ff 40%, #2fb8d4 85%); mix-blend-mode: screen; animation: aga-flash .5s var(--ease-out); }
.aga-fx__flash.is-gold { --fo: .6; background: radial-gradient(circle at 50% 40%, #fff, #ffe3a0 40%, #c98a2a 85%); mix-blend-mode: screen; animation: aga-flash .5s var(--ease-out); }
.aga-lair--ophion .aga-fx__flash.is-gold { mix-blend-mode: multiply; --fo: .35; background: radial-gradient(circle, #fff3d6, #c9a24c); }

/* ---------- card pills: release status (when not simply Released) and Free / Free-to-play ---------- */
.aga-gcard__pills { position: absolute; left: 10px; top: 10px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; pointer-events: none; }
.aga-pill { --pc: var(--gilt-hi); display: inline-flex; align-items: center; gap: .4em; padding: .28em .62em .3em; border-radius: 999px; font: 600 .74rem/1 var(--f-ui); letter-spacing: .01em; color: var(--pc); background: rgba(7, 5, 11, .78); border: 1px solid color-mix(in srgb, var(--pc) 55%, transparent); backdrop-filter: blur(4px); }
.aga-pill::before { content: ""; width: .42em; height: .42em; border-radius: 50%; background: var(--pc); box-shadow: 0 0 6px var(--pc); }
.aga-pill[data-s="early-access"] { --pc: #ffb347; }
.aga-pill[data-s="beta-playtest"] { --pc: #6fd3ff; }
.aga-pill[data-s="demo"] { --pc: #8fe0ac; }
.aga-pill[data-s="prototype"] { --pc: #c4a2ff; }
.aga-pill[data-s="game-jam"] { --pc: #ff8ad8; }
.aga-pill[data-s="coming-soon"] { --pc: #d8d0e2; }
.aga-pill[data-s="shut-down"] { --pc: #9a8fa6; }
.aga-pill[data-s="shut-down"]::before { box-shadow: none; }
.aga-pill[data-s="free"], .aga-pill[data-s="free-to-play"] { --pc: var(--gilt-hi); }

/* ---------- lair flashes (2.4): a soft tint, never a full white frame or a strobe ---------- */
.aga-hero--lair .aga-fx__flash.is-white { --fo: .2; animation: aga-flash-soft .7s var(--ease-out); }
.aga-hero--lair .aga-fx__flash.is-red { --fo: .18; animation: aga-flash-soft .35s var(--ease-out); }
.aga-hero--lair .aga-fx__flash.is-violet, .aga-hero--lair .aga-fx__flash.is-frost, .aga-hero--lair .aga-fx__flash.is-gold { --fo: .22; animation: aga-flash-soft .5s var(--ease-out); }
.aga-lair--ophion .aga-fx__flash.is-gold { --fo: .2; }
.aga-hero--lair .aga-fx__flash.is-neg { mix-blend-mode: normal; background: rgba(255, 255, 255, .6); --fo: .16; animation: aga-flash-soft .45s ease-out; }
@keyframes aga-flash-soft { 0% { opacity: var(--fo, .2); } 100% { opacity: 0; } }

/* ---------- 2.5: the Ward answers a blocked strike; touch fights do not scroll the page ---------- */
.aga-fx__ward.is-block svg { animation: aga-spin 6s linear infinite, aga-ward-block .35s cubic-bezier(.2,.8,.2,1); }
@keyframes aga-ward-block { 0% { transform: scale(1); } 35% { transform: scale(1.12); filter: drop-shadow(0 0 26px #fff) drop-shadow(0 0 48px var(--gilt)); } 100% { transform: scale(1); } }
.aga-hero.is-fight .aga-hero__canvas, .aga-hero.is-fight .aga-fx__ward { touch-action: none; }
/* while attacks fly, the headline and search never swallow a dodge; the Ward is always reachable */
.aga-hero.is-cine .aga-hero__copy, .aga-hero.is-fight .aga-hero__copy, .aga-hero.is-fight .aga-hero__hint { pointer-events: none; }
.aga-fx__ward.is-on { z-index: 9; }
body.aga-touch .aga-fx__ward.is-on { pointer-events: auto; }

/* 2.12: the white lair needs dark gold for text-like accents in the shared hero copy */
.aga-lair--ophion .aga-hero-search__label, .aga-lair--ophion .aga-hero-stats dd { color: #7a5d1f; }
.aga-lair--ophion .aga-hero-search__box { color: #7a5d1f; border-color: rgba(122, 93, 31, .55); }
.aga-lair--ophion .aga-hero-search__box button { background: #7a5d1f; color: #fff; }
.aga-lair--ophion .aga-hero-chips a:hover, .aga-lair--ophion .aga-hero-chips a:focus-visible { color: #7a5d1f; border-color: #7a5d1f; }

/* ---------- Save to My Collection (2.17). The button comes from the Adventure plugin
   (agar_save_button); the theme only gives it room beside each page's own actions. ---------- */
.aga-article__acts { margin-top: 18px; }
.aga-article__acts .agar-save--chip,
.aga-game__acts .agar-save--chip,
.aga-asset__info .agar-save--chip { margin-left: 0; padding: 10px 16px; font-size: .85rem; }
.aga-asset__info .aga-btn + .agar-save--chip { margin-left: 12px; }
@media (max-width: 520px) { .aga-asset__info .aga-btn + .agar-save--chip { margin: 12px 0 0; } }