/**
 * GET YOUR SAVE core SNES components.
 *
 * No rounded corners. No blurred shadows. Hard pixel UI only.
 */

.snes-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	min-height: 44px;
	padding: var(--space-3) var(--space-4);
	border: 2px solid #000000;
	border-radius: 0 !important;
	background: var(--color-panel);
	box-shadow:
		0 6px 0 #000000,
		inset 2px 2px 0 rgba(255, 255, 255, 0.42),
		inset -2px -2px 0 rgba(0, 0, 0, 0.18);
	color: var(--color-text);
	font-family: var(--font-pixel);
	font-size: var(--font-size-xs);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	transition:
		transform var(--duration-fast) var(--ease-step),
		box-shadow var(--duration-fast) var(--ease-step),
		background-color var(--duration-fast) var(--ease-step),
		color var(--duration-fast) var(--ease-step);
}

.snes-button:hover {
	transform: translateY(3px);
	box-shadow:
		0 3px 0 #000000,
		inset 2px 2px 0 rgba(255, 255, 255, 0.42),
		inset -2px -2px 0 rgba(0, 0, 0, 0.18);
	color: var(--color-text);
}

.snes-button:active,
.snes-button.is-active {
	transform: translateY(6px);
	box-shadow:
		0 0 0 #000000,
		inset 2px 2px 0 rgba(0, 0, 0, 0.2);
}

.snes-button:disabled,
.snes-button[aria-disabled="true"],
.snes-button.is-disabled {
	transform: none;
	box-shadow: var(--shadow-pixel);
}

.snes-button--red {
	background: var(--color-red);
	color: var(--color-text-inverse);
}

.snes-button--red:hover {
	color: var(--color-text-inverse);
}

.snes-button--blue {
	background: var(--color-blue);
	color: var(--color-text-inverse);
}

.snes-button--blue:hover {
	color: var(--color-text-inverse);
}

.snes-button--yellow {
	background: var(--color-yellow);
	color: var(--color-black);
}

.snes-button--green {
	background: var(--color-green);
	color: var(--color-text-inverse);
}

.snes-button--green:hover {
	color: var(--color-text-inverse);
}

.snes-panel {
	border: var(--border-hard);
	border-radius: 0 !important;
	background: var(--color-panel);
	box-shadow: var(--shadow-pixel);
	color: var(--color-text);
	padding: var(--space-5);
}

.shop-header,
.archive-header,
.article-hero,
.product-hero,
.purchase-panel,
.product-specs-panel,
.product-tabs,
.game-archive-lore,
.related-cartridge-shelf,
.about-this-article,
.insert-cartridge,
.system-status {
	position: relative;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0) 44%),
		#e0e0e0;
	box-shadow:
		inset 2px 2px 0 #ffffff,
		inset -2px -2px 0 rgba(0, 0, 0, 0.2),
		4px 4px 0 #000000;
}

.shop-header::before,
.archive-header::before,
.article-hero::before,
.product-specs-panel::before,
.product-tabs::before,
.game-archive-lore::before,
.related-cartridge-shelf::before,
.about-this-article::before,
.insert-cartridge::before,
.system-status::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 34px;
	border-bottom: 2px solid #777777;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0) 62%),
		#cfcfcf;
	pointer-events: none;
}

.shop-header > *,
.archive-header > *,
.article-hero > *,
.product-specs-panel > *,
.product-tabs > *,
.game-archive-lore > *,
.related-cartridge-shelf > *,
.about-this-article > *,
.insert-cartridge > *,
.system-status > * {
	position: relative;
	z-index: 1;
}

.shop-header__title,
.archive-header__title,
.article-hero__title,
.purchase-panel__title,
.product-specs-panel__title,
.product-tabs__title,
.game-archive-lore__title,
.related-cartridge-shelf h2,
.about-this-article__title,
.insert-cartridge__title,
.system-status__title {
	margin: 0 0 var(--space-4);
	font-family: var(--font-pixel);
	font-size: clamp(0.86rem, 1.35vw, 1.15rem);
	line-height: 1.55;
	text-transform: uppercase;
}

.shop-header__title::before,
.archive-header__title::before,
.article-hero__title::before,
.purchase-panel__title::before,
.product-specs-panel__title::before,
.product-tabs__title::before,
.game-archive-lore__title::before,
.related-cartridge-shelf h2::before,
.about-this-article__title::before,
.insert-cartridge__title::before,
.system-status__title::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: var(--space-2);
	border: 1px solid #000000;
	background: #e60012;
	vertical-align: 0.08em;
}

.snes-panel--flat {
	box-shadow: none;
}

.snes-panel--dark {
	background: var(--color-panel-dark);
	color: var(--color-text-inverse);
}

.snes-panel--dark h1,
.snes-panel--dark h2,
.snes-panel--dark h3,
.snes-panel--dark h4,
.snes-panel--dark h5,
.snes-panel--dark h6 {
	color: var(--color-text-inverse);
}

.snes-panel--red {
	border-color: var(--color-red);
}

.snes-panel--blue {
	border-color: var(--color-blue);
}

.snes-panel--yellow {
	border-color: var(--color-yellow);
}

.snes-panel--green {
	border-color: var(--color-green);
}

.snes-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 28px;
	padding: var(--space-1) var(--space-2);
	border: 2px solid #000000;
	border-radius: 0 !important;
	background: var(--color-panel);
	box-shadow: var(--shadow-pixel-small);
	color: var(--color-text);
	font-family: var(--font-pixel);
	font-size: 0.625rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
	white-space: nowrap;
}

.snes-chip--red,
.snes-chip--patch {
	background: var(--color-red);
	color: var(--color-text-inverse);
}

.snes-chip--blue,
.snes-chip--info,
.snes-chip--archive {
	background: var(--color-blue);
	color: var(--color-text-inverse);
}

.snes-chip--yellow,
.snes-chip--warning,
.snes-chip--note {
	background: var(--color-yellow);
	color: var(--color-black);
}

.snes-chip--green,
.snes-chip--success,
.snes-chip--fram {
	background: var(--color-green);
	color: var(--color-text-inverse);
}

.snes-chip--outline {
	background: var(--color-panel);
	color: var(--color-text);
}

.snes-chip-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
}

.product-hero {
	display: grid;
	grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.1fr);
	gap: var(--space-6);
	border: 4px solid #000000;
	border-radius: 0 !important;
	background: var(--color-panel);
	box-shadow: var(--shadow-pixel);
}

.product-hero.snes-panel {
	padding: var(--space-4);
}

.product-hero__media {
	aspect-ratio: 4 / 3;
	border: 4px solid #000000;
	background: #c0c0c0;
	overflow: hidden;
}

.product-hero__media img {
	width: 80%;
	height: auto;
	max-height: 62%;
	object-fit: contain;
	image-rendering: auto;
}

.product-hero__placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	background: #111111;
	color: #ffffff;
	font-family: var(--font-pixel);
	text-shadow: 2px 2px 0 #000000;
}

.product-hero__placeholder > span {
	padding: var(--space-4);
	border: 2px solid #000000;
	background: var(--color-red);
}

.product-hero__content {
	display: grid;
	align-content: center;
	gap: var(--space-4);
	min-width: 0;
}

.product-hero__title {
	font-size: clamp(1.4rem, 3vw, 2.125rem);
	line-height: 1.45;
	text-shadow: 2px 2px 0 #000000;
}

.purchase-panel {
	display: grid;
	gap: var(--space-3);
	align-content: start;
	border-width: 4px;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0) 48%),
		#1f1f1f;
	color: #ffffff;
}

.purchase-panel__title {
	color: #ffffff;
}

.purchase-panel__price {
	padding: var(--space-3);
	border: 2px solid #000000;
	background: #e0e0e0;
	color: #e60012;
	font-family: var(--font-pixel);
	font-size: clamp(1.2rem, 2vw, 1.85rem);
	line-height: 1.3;
	text-shadow: 2px 2px 0 #000000;
}

.purchase-panel__stock {
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	background: #111111;
	color: #43d65f;
	font-family: var(--font-mono);
	font-weight: 900;
	text-transform: uppercase;
}

.purchase-panel form.cart {
	display: grid;
	gap: var(--space-3);
}

.purchase-panel .quantity input {
	min-height: 44px;
	background: #efefef;
	font-family: var(--font-pixel);
	text-align: center;
}

.purchase-panel .single_add_to_cart_button {
	min-height: 48px;
	border: 2px solid #000000;
	background: #e60012;
	box-shadow: 4px 4px 0 #000000;
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.72rem;
	text-transform: uppercase;
}

.code-cartridge {
	position: relative;
	display: grid;
	grid-template-rows: 1fr 34px 44px;
	min-height: 350px;
	padding: 42px 74px 22px;
	border: 6px solid #000000;
	background:
		linear-gradient(90deg, rgba(0, 0, 0, 0.24) 0 9%, transparent 9% 91%, rgba(0, 0, 0, 0.24) 91% 100%),
		linear-gradient(180deg, #d9d9df 0%, #b9b9c1 58%, #9999a2 100%);
	box-shadow:
		inset 7px 7px 0 rgba(255, 255, 255, 0.45),
		inset -7px -7px 0 rgba(0, 0, 0, 0.28),
		0 8px 0 #000000;
	clip-path: polygon(0 0, 100% 0, 100% 88%, 92% 100%, 8% 100%, 0 88%);
}

.code-cartridge::before,
.code-cartridge::after {
	content: "";
	position: absolute;
	top: 74px;
	width: 54px;
	height: 70%;
	border: 4px solid #000000;
	background:
		repeating-linear-gradient(180deg, #b0b0b9 0 42px, #8f8f98 42px 46px);
	box-shadow: inset 3px 3px 0 rgba(255, 255, 255, 0.5);
}

.code-cartridge::before {
	left: 14px;
}

.code-cartridge::after {
	right: 14px;
}

.code-cartridge__slot {
	align-self: center;
	width: 78%;
	height: 24px;
	margin-inline: auto;
	border: 4px solid #000000;
	background:
		linear-gradient(180deg, #555555, #1f1f1f 55%, #777777);
	box-shadow: inset 0 5px 0 #050505;
}

.code-cartridge__label {
	position: relative;
	z-index: 1;
	display: grid;
	align-content: center;
	gap: var(--space-4);
	align-self: start;
	margin: 0 18px var(--space-4);
	padding: var(--space-4);
	border: 6px solid #000000;
	background:
		radial-gradient(circle at 70% 20%, rgba(242, 169, 0, 0.9), rgba(242, 169, 0, 0) 24%),
		linear-gradient(135deg, #e60012 0%, #111111 52%, #0072b2 100%);
	color: #ffffff;
	text-align: center;
	box-shadow: inset 5px 5px 0 rgba(255, 255, 255, 0.22);
}

.code-cartridge__label strong {
	font-family: var(--font-pixel);
	font-size: clamp(1rem, 2.3vw, 1.8rem);
	line-height: 1.55;
	text-shadow: 4px 4px 0 #000000;
	text-transform: uppercase;
}

.code-cartridge__label span {
	font-family: var(--font-pixel);
	font-size: 0.68rem;
	line-height: 1.5;
	text-shadow: 2px 2px 0 #000000;
}

.code-cartridge__series {
	display: inline-flex;
	justify-self: center;
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	background: #f2a900;
	color: #000000;
	text-shadow: none !important;
}

.code-cartridge__ridges {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--space-3);
	align-items: end;
	margin-inline: 54px;
}

.code-cartridge__ridges span {
	height: 28px;
	border: 4px solid #000000;
	background: #b6b6b6;
	box-shadow: inset 3px 3px 0 rgba(255, 255, 255, 0.45);
}

.code-thumb-rail {
	display: grid;
	grid-template-columns: 40px repeat(4, minmax(0, 1fr)) 40px;
	gap: var(--space-2);
	align-items: center;
	min-height: 78px;
	border: 2px solid #000000;
	background: #efefef;
	box-shadow: inset 2px 2px 0 #ffffff, inset -2px -2px 0 rgba(0, 0, 0, 0.24);
	padding: var(--space-2);
}

.code-thumb-rail::before,
.code-thumb-rail::after {
	display: grid;
	place-items: center;
	height: 100%;
	border: 2px solid #000000;
	background: #111111;
	color: #ffffff;
	font-family: var(--font-pixel);
}

.code-thumb-rail::before {
	content: "<";
}

.code-thumb-rail::after {
	content: ">";
}

.code-thumb {
	display: block;
	aspect-ratio: 4 / 3;
	border: 4px solid #000000;
	background:
		radial-gradient(circle at 72% 28%, #f2a900 0 10%, transparent 11%),
		linear-gradient(135deg, #25380f, #111111 52%, #8b2a1f);
	box-shadow: inset 2px 2px 0 rgba(255, 255, 255, 0.3);
}

.code-thumb--two {
	background: linear-gradient(135deg, #4b2b12, #111111 52%, #c06b1a);
}

.code-thumb--three {
	background: linear-gradient(135deg, #07273a, #111111 52%, #0072b2);
}

.code-thumb--four {
	background: linear-gradient(135deg, #18341f, #111111 52%, #e60012);
}

.code-hero__panel,
.code-system-panel,
.code-series-panel,
.quick-links-panel {
	border: 2px solid #000000;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0) 36%),
		#efefef;
	box-shadow:
		inset 3px 3px 0 rgba(255, 255, 255, 0.75),
		inset -3px -3px 0 rgba(0, 0, 0, 0.18),
		4px 4px 0 #000000;
	color: #111111;
}

.code-hero__panel {
	display: grid;
	align-content: center;
	gap: var(--space-3);
	padding: var(--space-4);
}

.code-hero__panel h1,
.code-system-panel h2,
.code-series-panel h2 {
	margin: 0;
	font-family: var(--font-pixel);
	line-height: 1.55;
	text-shadow: 2px 2px 0 #000000;
}

.code-hero__panel h1 {
	font-size: clamp(1.45rem, 3vw, 2.35rem);
	margin: 0;
}

.code-hero__subtitle {
	margin: 0;
	font-family: var(--font-pixel);
	font-size: 0.72rem;
	text-transform: uppercase;
}

.code-platform-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
}

.code-platform-tabs span {
	min-width: 92px;
	padding: var(--space-1) var(--space-3);
	border: 2px solid #000000;
	background: #e0e0e0;
	font-family: var(--font-mono);
	font-size: 0.78rem;
	font-weight: 800;
	text-align: center;
}

.code-price-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-5);
	align-items: center;
}

.code-hero__price {
	color: #e60012;
	font-family: var(--font-pixel);
	font-size: clamp(1.55rem, 4vw, 3rem);
	line-height: 1.2;
	text-shadow: 3px 3px 0 #000000;
}

.code-stock {
	color: #009b48;
	font-family: var(--font-pixel);
	font-size: 0.72rem;
}

.code-spec-grid {
	display: grid;
	grid-template-columns: 110px minmax(0, 1fr);
	gap: var(--space-1) var(--space-4);
	font-family: var(--font-mono);
	font-size: 0.9rem;
	line-height: 1.35;
}

.code-spec-grid span {
	font-weight: 900;
	text-transform: uppercase;
}

.code-spec-grid b {
	font-weight: 900;
}

.code-feature-row {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 4px;
	border: 2px solid #000000;
	background: #000000;
}

.code-feature-row span {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: var(--space-1) var(--space-2);
	align-items: center;
	min-height: 62px;
	padding: var(--space-2);
	background: #e0e0e0;
}

.code-feature-row i {
	grid-row: span 2;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border: 2px solid #000000;
	background: #ffffff;
	font-style: normal;
	font-weight: 900;
}

.code-feature-row b,
.code-feature-row small {
	line-height: 1.15;
}

.code-feature-row b {
	font-family: var(--font-pixel);
	font-size: 0.55rem;
}

.code-feature-row small {
	font-family: var(--font-mono);
	font-size: 0.72rem;
}

.code-hero__archive-button {
	background: #d7d7d7;
	color: #111111;
}

.cartridge-card__code-cover-label,
.archive-card__code-cover-label {
	position: relative;
	z-index: 2;
}

.code-spec-table {
	border: 4px solid #000000;
	background: #000000;
}

.code-spec-table th,
.code-spec-table td {
	border: 2px solid #000000;
	padding: var(--space-3);
	background: #e0e0e0;
}

.code-spec-table th {
	width: 32%;
	background: #1f1f1f;
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.68rem;
}

.code-spec-table td {
	font-weight: 800;
}

.code-system-panel,
.code-series-panel,
.quick-links-panel {
	padding: var(--space-5);
}

.code-console-svg {
	display: block;
	width: min(100%, 360px);
	margin: var(--space-4) auto;
	filter: drop-shadow(4px 4px 0 #000000);
}

.code-led-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-2);
}

.code-led-row span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	min-height: 42px;
	border: 2px solid #000000;
	background: #111111;
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.62rem;
}

.led {
	width: 12px;
	height: 12px;
	border: 2px solid #000000;
	box-shadow: 0 0 8px currentColor;
}

.led--red {
	background: #e60012;
	color: #e60012;
}

.led--green {
	background: #009b48;
	color: #009b48;
}

.led--yellow {
	background: #f2a900;
	color: #f2a900;
}

.code-series-list {
	display: grid;
	gap: 4px;
	margin-top: var(--space-4);
	border: 4px solid #000000;
	background: #000000;
}

.code-series-item {
	display: grid;
	grid-template-columns: 50px minmax(0, 1fr) auto;
	gap: var(--space-3);
	align-items: center;
	padding: var(--space-3);
	background: #e0e0e0;
	color: #111111;
	text-decoration: none;
}

.code-series-item b {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 30px;
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	background: #005ca8;
	box-shadow: 2px 2px 0 #000000;
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.55rem;
	white-space: nowrap;
}

.code-series-item:hover {
	background: #f2a900;
	color: #000000;
}

.code-series-item strong {
	display: block;
	font-family: var(--font-pixel);
	font-size: 0.72rem;
	line-height: 1.55;
}

.code-series-item small {
	display: block;
	margin-top: var(--space-1);
	color: #555555;
	font-weight: 800;
}

.pixel-avatar {
	width: 42px;
	height: 42px;
	border: 2px solid #000000;
	background: #111111;
	box-shadow:
		6px 0 0 #111111,
		0 6px 0 #111111,
		6px 6px 0 #111111,
		inset 0 0 0 6px #e0e0e0;
	image-rendering: pixelated;
}

.pixel-avatar--1 {
	background: #e60012;
	box-shadow:
		6px 0 0 #111111,
		0 6px 0 #f2a900,
		6px 6px 0 #0072b2,
		inset 0 0 0 8px #ffffff;
}

.pixel-avatar--2 {
	background: #0072b2;
	box-shadow:
		6px 0 0 #009b48,
		0 6px 0 #111111,
		6px 6px 0 #f2a900,
		inset 0 0 0 8px #ffffff;
}

.pixel-avatar--3 {
	background: #009b48;
	box-shadow:
		6px 0 0 #f2a900,
		0 6px 0 #e60012,
		6px 6px 0 #111111,
		inset 0 0 0 8px #ffffff;
}

.pixel-avatar--4 {
	background: #f2a900;
	box-shadow:
		6px 0 0 #0072b2,
		0 6px 0 #111111,
		6px 6px 0 #e60012,
		inset 0 0 0 8px #ffffff;
}

.cartridge-shelf,
.archive-feed,
.cartridge-shelf__grid,
.archive-feed__grid,
.related-cartridge-shelf__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 4px;
	align-items: stretch;
	border: 4px solid #000000;
	background: #000000;
}

.cartridge-card,
.archive-card {
	display: flex;
	flex-direction: column;
	gap: 0;
	min-width: 0;
	overflow: hidden;
	border: 0;
	border-radius: 0 !important;
	background: #e0e0e0;
	box-shadow:
		inset 2px 2px 0 rgba(255, 255, 255, 0.72),
		inset -2px -2px 0 rgba(0, 0, 0, 0.18);
	color: #111111;
}

.cartridge-card__media,
.archive-card__media {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border: 0;
	border-bottom: 4px solid #000000;
	background: #111111;
	overflow: hidden;
	text-decoration: none;
}

.cartridge-image-wrapper {
	position: relative;
	display: grid;
	place-items: start center;
	padding: clamp(18px, 7%, 30px) clamp(18px, 8%, 34px) clamp(44px, 16%, 64px);
	background: #c0c0c0;
	border-radius: 6px 6px 0 0;
	box-shadow:
		inset 0 3px 8px rgba(0, 0, 0, 0.15),
		inset 0 -3px 5px rgba(255, 255, 255, 0.5),
		inset 14px 0 0 #a3a3aa,
		inset -14px 0 0 #d8d8dc;
}

.cartridge-image-wrapper::after {
	content: "";
	position: absolute;
	left: 13%;
	right: 13%;
	bottom: 15%;
	height: 8px;
	border: 2px solid #000000;
	background: #111111;
	box-shadow:
		0 13px 0 #111111,
		inset 0 2px 0 rgba(255, 255, 255, 0.18);
}

.cartridge-image-wrapper > img,
.cartridge-image-wrapper .cartridge-card__image {
	position: relative;
	z-index: 1;
	width: 80%;
	height: auto;
	max-height: 62%;
	margin-top: 0;
	border: 3px solid #000000;
	background: #ffffff;
	box-shadow:
		0 4px 0 rgba(0, 0, 0, 0.7),
		inset 0 0 0 2px rgba(255, 255, 255, 0.5);
	object-fit: contain;
	image-rendering: auto;
}

.cartridge-card__image,
.archive-card__image {
	width: 100%;
	height: 100%;
	object-fit: contain;
	image-rendering: pixelated;
}

.cartridge-card__image-placeholder,
.archive-card__image-placeholder,
.cartridge-card__code-cover,
.archive-card__code-cover {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	background:
		radial-gradient(circle at 75% 18%, rgba(242, 169, 0, 0.92), rgba(242, 169, 0, 0) 20%),
		linear-gradient(135deg, #e60012 0 28%, #111111 28% 58%, #0072b2 58% 100%);
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.7rem;
	line-height: 1.5;
	text-align: center;
	text-shadow: 2px 2px 0 #000000;
}

.cartridge-card__code-cover {
	position: relative;
	border-inline: 0;
}

.cartridge-card__code-cover::before {
	content: "";
	position: absolute;
	inset: 18px 24px auto;
	height: 38%;
	border: 4px solid #000000;
	background:
		radial-gradient(circle at 75% 18%, rgba(242, 169, 0, 0.92), rgba(242, 169, 0, 0) 20%),
		linear-gradient(135deg, #e60012 0 28%, #111111 28% 58%, #0072b2 58% 100%);
}

.cartridge-card__code-cover:has(.cartridge-card__image)::before {
	content: none;
}

.cartridge-card__image-placeholder > span,
.archive-card__image-placeholder > span,
.cartridge-card__code-cover-label,
.archive-card__code-cover-label {
	display: grid;
	gap: var(--space-2);
	max-width: 82%;
	padding: var(--space-3);
	border: 2px solid #000000;
	background: rgba(17, 17, 17, 0.92);
	box-shadow: 4px 4px 0 #000000;
}

.cartridge-image-wrapper .cartridge-card__code-cover-label {
	position: absolute;
	z-index: 2;
	left: 50%;
	bottom: 28%;
	width: min(72%, 240px);
	transform: translateX(-50%);
}

.cartridge-card__code-cover-label strong,
.archive-card__code-cover-label strong {
	font-size: 0.72rem;
	line-height: 1.55;
	text-transform: uppercase;
}

.cartridge-card__code-cover-label small,
.archive-card__code-cover-label small {
	color: #f2a900;
	font-size: 0.58rem;
	line-height: 1.35;
	text-transform: uppercase;
}

.cartridge-card__body,
.archive-card__body {
	display: grid;
	gap: var(--space-2);
	min-width: 0;
	padding: var(--space-3);
}

.cartridge-card__title,
.archive-card__title {
	margin: 0;
	font-family: var(--font-pixel);
	font-size: 0.78rem;
	line-height: 1.55;
	letter-spacing: 0;
	overflow-wrap: anywhere;
	text-shadow: none;
	filter: none;
}

.cartridge-card__title a,
.archive-card__title a,
.gys-article-title,
.gys-article-title a {
	color: var(--color-text);
	text-decoration: none;
	text-shadow: 2px 2px 0 #000000;
	filter: none;
}

.cartridge-card__title a:hover,
.archive-card__title a:hover,
.gys-article-title a:hover {
	color: var(--color-blue);
	text-shadow: 2px 2px 0 #000000;
}

.archive-card__meta,
.cartridge-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
	color: var(--color-text-muted);
	font-size: 0.75rem;
}

.cartridge-card__price {
	color: #e60012;
	font-family: var(--font-pixel);
	font-size: 0.9rem;
	text-shadow: 1px 1px 0 #000000;
}

.cartridge-card__sku {
	font-family: var(--font-mono);
	font-weight: 800;
}

.archive-card__excerpt {
	margin: 0;
	color: var(--color-text);
	font-size: 0.88rem;
	line-height: 1.45;
}

.cartridge-card__actions {
	margin-top: auto;
	padding: 0 var(--space-3) var(--space-3);
}

.cartridge-card__add-to-cart {
	width: 100%;
	min-height: 36px;
	padding: var(--space-2) var(--space-3);
}

.archive-feed {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.archive-card {
	position: relative;
}

.archive-card__media {
	aspect-ratio: 16 / 9;
}

.archive-card__badges {
	position: absolute;
	z-index: 2;
	padding: var(--space-2);
}

.code-status-list {
	display: grid;
	gap: var(--space-1);
	margin: var(--space-3) 0;
	padding: var(--space-3);
	border: 2px solid #000000;
	background: #111111;
	color: #ffffff;
}

.code-status-list div {
	display: grid;
	grid-template-columns: 82px 1fr;
	gap: var(--space-2);
}

.code-status-list dt,
.code-status-list dd {
	margin: 0;
	font-family: var(--font-mono);
	font-weight: 800;
}

.code-status-list dd {
	color: #43d65f;
}

.quick-links-panel {
	display: grid;
	gap: 0;
}

.quick-links-panel h2 {
	margin: 0;
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	border-bottom: 0;
	background: #cfcfcf;
	font-family: var(--font-pixel);
	font-size: 0.82rem;
}

.quick-links-panel a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 38px;
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	border-top: 0;
	background: #e0e0e0;
	color: #111111;
	font-family: var(--font-pixel);
	font-size: 0.62rem;
	text-decoration: none;
}

.quick-links-panel a:hover {
	background: #f2a900;
}

.product-specs-panel__list,
.about-this-article__list {
	display: grid;
	gap: 0;
	margin: 0;
	border: 4px solid #000000;
	background: #000000;
}

.product-specs-panel__list div,
.about-this-article__list div {
	display: grid;
	grid-template-columns: minmax(130px, 0.34fr) minmax(0, 1fr);
	gap: 0;
}

.product-specs-panel__list dt,
.about-this-article__list dt,
.product-specs-panel__list dd,
.about-this-article__list dd {
	margin: 0;
	padding: var(--space-3);
	border: 1px solid #000000;
	background: #e0e0e0;
}

.product-specs-panel__list dt,
.about-this-article__list dt {
	background: #1f1f1f;
	color: #ffffff;
	font-family: var(--font-pixel);
	font-size: 0.62rem;
	line-height: 1.45;
}

.product-specs-panel__list dd,
.about-this-article__list dd {
	font-weight: 800;
}

.product-tabs {
	padding-top: var(--space-5);
}

.product-tabs__panel {
	margin-top: var(--space-3);
	padding: var(--space-4);
	border: 2px solid #000000;
	background: #f7f7f7;
	box-shadow: inset 2px 2px 0 #ffffff;
}

.product-tabs__panel h3 {
	display: inline-flex;
	margin: 0 0 var(--space-3);
	padding: var(--space-2) var(--space-3);
	border: 2px solid #000000;
	background: #d3d3d3;
	font-size: 0.72rem;
}

.game-archive-lore__header {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--space-4);
}

.game-archive-lore__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 4px;
	border: 4px solid #000000;
	background: #000000;
}

.related-cartridge-shelf {
	display: grid;
	gap: var(--space-4);
	padding: var(--space-5);
	border: 2px solid #000000;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0) 44%),
		#e0e0e0;
	box-shadow: var(--shadow-pixel);
}

.insert-cartridge {
	border: 2px dashed #e60012;
	outline: 2px solid #000000;
	outline-offset: -6px;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0) 44%),
		#dcdcdc;
}

.insert-cartridge__subtitle {
	margin: calc(var(--space-2) * -1) 0 var(--space-3);
	font-family: var(--font-mono);
	font-size: 0.85rem;
	font-weight: 900;
}

.insert-cartridge__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 4px;
	border: 4px solid #000000;
	background: #000000;
}

.insert-cartridge .cartridge-card {
	min-width: 0;
}

.insert-cartridge .cartridge-card__media {
	aspect-ratio: 1 / 0.8;
}

.insert-cartridge .cartridge-card__body {
	padding: var(--space-2);
}

.insert-cartridge .cartridge-card__title {
	font-size: 0.58rem;
}

.insert-cartridge .snes-chip,
.insert-cartridge .cartridge-card__sku {
	display: none;
}

.insert-cartridge .cartridge-card__price {
	font-size: 0.68rem;
}

.insert-cartridge .cartridge-card__actions {
	padding: 0 var(--space-2) var(--space-2);
}

.insert-cartridge .cartridge-card__add-to-cart {
	min-height: 30px;
	font-size: 0.5rem;
}

.article-hero__meta {
	display: flex;
	gap: var(--space-3);
	align-items: center;
	margin-bottom: var(--space-4);
	font-family: var(--font-mono);
	font-weight: 800;
}

.article-hero__image {
	margin: 0;
	border: 4px solid #000000;
	background: #111111;
	box-shadow: 4px 4px 0 #000000;
}

.article-hero__image img {
	width: 100%;
	aspect-ratio: 16 / 7;
	object-fit: cover;
	image-rendering: pixelated;
}

.article-content {
	font-size: 1rem;
	line-height: 1.75;
}

.article-content h2,
.article-content h3 {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	margin-top: var(--space-6);
	font-size: 1rem;
	line-height: 1.55;
}

.article-content h2::before,
.article-content h3::before {
	content: "";
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	border: 2px solid #000000;
	background: #e60012;
	box-shadow: 2px 2px 0 #000000;
}

.shop-filter-bar,
.archive-filter-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	align-items: center;
}

.shop-pagination,
.archive-pagination {
	padding: var(--space-3);
	border: 2px solid #000000;
	background: #efefef;
	box-shadow: var(--shadow-pixel-small);
}

.feature-icon {
	grid-row: span 2;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border: 2px solid #000000;
	background: #cfcfcf;
	box-shadow: inset 2px 2px 0 #ffffff, 3px 3px 0 #000000;
	color: #005ca8;
	font-family: var(--font-pixel);
	font-size: 1rem;
}

.feature-icon--cart {
	position: relative;
	background:
		linear-gradient(180deg, #bdbdc6, #8f8f98);
}

.feature-icon--cart::before {
	content: "";
	width: 30px;
	height: 22px;
	border: 2px solid #000000;
	background: #d7d7d7;
	box-shadow: inset 0 -6px 0 #777777;
}

.feature-icon--cart::after {
	content: "";
	position: absolute;
	bottom: 8px;
	width: 26px;
	height: 4px;
	background: #5d3191;
	border: 1px solid #000000;
}

.feature-icon--chip {
	position: relative;
	background: #111111;
}

.feature-icon--chip::before {
	content: "";
	width: 28px;
	height: 28px;
	border: 2px solid #000000;
	background: #555555;
	box-shadow:
		-8px 0 0 #111111,
		8px 0 0 #111111,
		0 -8px 0 #111111,
		0 8px 0 #111111,
		inset 4px 4px 0 rgba(255, 255, 255, 0.2);
}

.feature-icon--book {
	position: relative;
	background: #009b48;
}

.feature-icon--book::before,
.feature-icon--book::after {
	content: "";
	position: absolute;
	top: 10px;
	width: 16px;
	height: 28px;
	border: 2px solid #000000;
	background: #20bb48;
}

.feature-icon--book::before {
	left: 7px;
}

.feature-icon--book::after {
	right: 7px;
}

@media (max-width: 1024px) {
	.product-hero {
		grid-template-columns: 1fr;
	}

	.cartridge-shelf,
	.archive-feed,
	.cartridge-shelf__grid,
	.archive-feed__grid,
	.related-cartridge-shelf__grid {
		grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	}
}

@media (max-width: 640px) {
	.cartridge-shelf,
	.archive-feed,
	.cartridge-shelf__grid,
	.archive-feed__grid,
	.related-cartridge-shelf__grid {
		grid-template-columns: 1fr;
	}
}