/**
 * =========================================================
 * SAVE GAME - CALCULADORA DE CRUZAMENTO DO PALWORLD
 * =========================================================
 */


/* =========================================================
   VARIÁVEIS / IDENTIDADE SAVE GAME
   ========================================================= */

.calculadora-palworld {
	--sg-roxo: #8758f5;
	--sg-roxo-hover: #7747eb;
	--sg-roxo-forte: #6c3ff0;

	--sg-roxo-claro: rgba(135, 88, 245, 0.08);
	--sg-roxo-claro-forte: rgba(135, 88, 245, 0.14);
	--sg-roxo-borda: rgba(135, 88, 245, 0.28);

	--sg-texto: #181a20;
	--sg-texto-secundario: #5f6472;
	--sg-texto-suave: #9aa1af;

	--sg-fundo: #ffffff;
	--sg-fundo-pagina: #f6f7fb;
	--sg-fundo-card: #fcfcff;
	--sg-fundo-suave: #faf8ff;
	--sg-fundo-hover: #f7f2ff;

	--sg-borda: #e6e7ec;
	--sg-borda-forte: #d9dbe3;

	--sg-sombra-suave: 0 10px 30px rgba(18, 24, 40, 0.06);
	--sg-sombra-card: 0 18px 45px rgba(18, 24, 40, 0.08);

	width: 100%;
	max-width: 1100px;

	margin: 0 auto;
	padding: 14px 0 40px;

	color: var(--sg-texto);

	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Roboto,
		Arial,
		sans-serif;
}


/* =========================================================
   BOX SIZING
   ========================================================= */

.calculadora-palworld,
.calculadora-palworld *,
.calculadora-palworld *::before,
.calculadora-palworld *::after {
	box-sizing: border-box;
}


/* =========================================================
   ABAS / MODOS
   ========================================================= */

.calculadora-modos {
	display: inline-flex;

	gap: 6px;

	margin: 0 0 18px;
	padding: 6px;

	border: 1px solid var(--sg-borda);
	border-radius: 18px;

	background: rgba(255, 255, 255, 0.96);

	box-shadow: 0 8px 24px rgba(25, 28, 38, 0.045);
}

.calculadora-modo {
	min-height: 52px;

	padding: 12px 22px;

	border: 0;
	border-radius: 14px;

	background: transparent;
	color: var(--sg-texto-secundario);

	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;

	cursor: pointer;

	transition:
		background-color 0.2s ease,
		color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;
}

.calculadora-modo:hover {
	background: var(--sg-fundo-hover);
	color: var(--sg-roxo);
}

.calculadora-modo.ativo {
	background: linear-gradient(
		135deg,
		#9868ff 0%,
		#8758f5 100%
	);
	color: #ffffff;

	box-shadow:
		0 10px 24px rgba(135, 88, 245, 0.26);
}

.calculadora-modo:focus-visible {
	outline: 3px solid var(--sg-roxo-borda);
	outline-offset: 2px;
}


/* =========================================================
   CAIXA PRINCIPAL
   ========================================================= */

.calculadora-caixa {
	width: 100%;

	overflow: hidden;

	border: 1px solid var(--sg-borda);
	border-radius: 24px;

	background:
		linear-gradient(
			180deg,
			rgba(255, 255, 255, 0.98) 0%,
			rgba(250, 249, 255, 0.98) 100%
		);

	box-shadow: var(--sg-sombra-card);
}


/* =========================================================
   PAINEL
   ========================================================= */

.calculadora-painel {
	width: 100%;

	padding: 28px;

	border: 0;
	border-radius: 0;

	background: transparent;
}

.calculadora-painel[hidden] {
	display: none;
}


/* =========================================================
   PAIS → FILHOTE
   ========================================================= */

.calculadora-pais {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		72px
		minmax(0, 1fr);

	gap: 18px;

	align-items: center;
}

.calculadora-pal {
	min-width: 0;
}


/* =========================================================
   LABELS
   ========================================================= */

.calculadora-label {
	display: block;

	margin-bottom: 10px;

	color: var(--sg-texto);

	font-size: 15px;
	line-height: 1.4;
	font-weight: 800;
}


/* =========================================================
   SELETOR DE PAL
   ========================================================= */

.calculadora-seletor-pal {
	display: flex;

	width: 100%;
	min-height: 108px;

	align-items: center;

	padding: 16px 18px;

	border: 1px solid var(--sg-borda-forte);
	border-radius: 18px;

	background: rgba(255, 255, 255, 0.92);
	color: var(--sg-texto);

	font-family: inherit;
	text-align: left;

	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.8);

	cursor: pointer;

	transition:
		border-color 0.2s ease,
		background-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;
}

.calculadora-seletor-pal:hover {
	border-color: rgba(135, 88, 245, 0.32);

	background: #ffffff;

	box-shadow:
		0 8px 20px rgba(135, 88, 245, 0.08);
}

.calculadora-seletor-pal:focus-visible {
	outline: none;

	border-color: var(--sg-roxo);

	box-shadow:
		0 0 0 3px var(--sg-roxo-claro),
		0 10px 22px rgba(135, 88, 245, 0.12);
}

.calculadora-pal-placeholder {
	color: var(--sg-texto-suave);

	font-size: 17px;
	font-weight: 600;
}


/* =========================================================
   PAL SELECIONADO
   ========================================================= */

.calculadora-pal-selecionado {
	display: flex;

	width: 100%;
	min-width: 0;

	align-items: center;

	gap: 15px;
}

.calculadora-pal-selecionado img {
	width: 76px;
	height: 76px;

	flex: 0 0 76px;

	padding: 4px;

	object-fit: contain;

	background:
		radial-gradient(
			circle at 30% 30%,
			#ffffff 0%,
			#faf6ff 100%
		);

	border: 3px solid rgba(135, 88, 245, 0.34);
	border-radius: 50%;

	box-shadow:
		0 0 0 4px rgba(135, 88, 245, 0.07);
}

.calculadora-pal-info {
	min-width: 0;
}

.calculadora-pal-numero {
	display: block;

	margin-bottom: 4px;

	color: var(--sg-roxo);

	font-size: 14px;
	font-weight: 800;
	line-height: 1.2;
}

.calculadora-pal-nome {
	display: block;

	overflow: hidden;

	color: var(--sg-texto);

	font-size: 21px;
	line-height: 1.25;
	font-weight: 800;

	text-overflow: ellipsis;
	white-space: nowrap;
}


/* =========================================================
   OPERADOR +
   ========================================================= */

.calculadora-operador {
	display: flex;

	width: 50px;
	height: 50px;

	align-items: center;
	justify-content: center;

	margin: 18px auto 0;

	border: 1px solid rgba(135, 88, 245, 0.24);
	border-radius: 50%;

	background:
		linear-gradient(
			135deg,
			rgba(135, 88, 245, 0.16),
			rgba(135, 88, 245, 0.08)
		);
	color: var(--sg-roxo);

	font-size: 30px;
	line-height: 1;
	font-weight: 500;

	box-shadow:
		0 8px 18px rgba(135, 88, 245, 0.10);
}


/* =========================================================
   ÁREA DE RESULTADO
   ========================================================= */

.calculadora-resultado {
	margin-top: 24px;
	padding-top: 24px;

	border-top: 1px solid var(--sg-borda);
}

.calculadora-resultados-pais {
	margin-top: 22px;
	padding-top: 22px;

	border-top: 1px solid var(--sg-borda);
}

.calculadora-resultado-vazio {
	margin: 0;

	color: var(--sg-texto-secundario);

	font-size: 18px;
	line-height: 1.7;
	font-weight: 500;

	text-align: center;
}


/* =========================================================
   RESULTADO DO FILHOTE
   ========================================================= */

.calculadora-filho-resultado {
	display: flex;

	width: 100%;
	max-width: 560px;

	align-items: center;

	gap: 20px;

	margin: 0 auto;
	padding: 22px;

	border: 1px solid rgba(135, 88, 245, 0.18);
	border-radius: 22px;

	background:
		linear-gradient(
			135deg,
			rgba(135, 88, 245, 0.10),
			rgba(255, 255, 255, 0.96) 52%
		);

	box-shadow:
		0 14px 30px rgba(135, 88, 245, 0.08);
}

.calculadora-filho-resultado img {
	width: 104px;
	height: 104px;

	flex: 0 0 104px;

	padding: 5px;

	object-fit: contain;

	background:
		radial-gradient(
			circle at 30% 30%,
			#ffffff 0%,
			#faf6ff 100%
		);

	border: 3px solid rgba(135, 88, 245, 0.36);
	border-radius: 50%;

	box-shadow:
		0 0 0 4px rgba(135, 88, 245, 0.07);
}

.calculadora-filho-resultado-info {
	min-width: 0;
}

.calculadora-filho-resultado-label {
	display: inline-flex;

	margin-bottom: 8px;
	padding: 5px 10px;

	border-radius: 999px;

	background: rgba(135, 88, 245, 0.11);
	color: var(--sg-roxo);

	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.calculadora-filho-resultado-numero {
	display: block;

	margin-bottom: 3px;

	color: var(--sg-texto-secundario);

	font-size: 14px;
	font-weight: 700;
}

.calculadora-filho-resultado-nome {
	margin: 0;

	color: var(--sg-texto);

	font-size: 31px;
	line-height: 1.15;
	font-weight: 800;
}


/* =========================================================
   FILHOTE → PAIS
   ========================================================= */

.calculadora-filho-escolha {
	width: 100%;
	max-width: 610px;
}


/* =========================================================
   FILTRO
   ========================================================= */

.calculadora-filtro-combinacoes {
	position: relative;

	width: 100%;
	max-width: 610px;

	margin-top: 18px;
}

.calculadora-filtro-combinacoes[hidden] {
	display: none;
}

.calculadora-filtro-label {
	display: block;

	margin-bottom: 9px;

	color: var(--sg-texto);

	font-size: 15px;
	font-weight: 800;
}

.calculadora-filtro-input {
	width: 100%;
	min-height: 54px;

	padding:
		13px
		16px
		13px
		46px;

	border: 1px solid var(--sg-borda-forte);
	border-radius: 16px;

	background: rgba(255, 255, 255, 0.96);
	color: var(--sg-texto);

	font-family: inherit;
	font-size: 16px;

	outline: none;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background-color 0.2s ease;
}

.calculadora-filtro-input::placeholder {
	color: var(--sg-texto-suave);
}

.calculadora-filtro-input:hover {
	border-color: var(--sg-roxo-borda);
}

.calculadora-filtro-input:focus {
	border-color: var(--sg-roxo);

	box-shadow:
		0 0 0 3px var(--sg-roxo-claro);
}


/* =========================================================
   ÍCONE DE BUSCA
   ========================================================= */

.calculadora-filtro-combinacoes::before {
	content: "";

	position: absolute;

	left: 17px;
	bottom: 19px;

	width: 14px;
	height: 14px;

	border: 2px solid var(--sg-texto-suave);
	border-radius: 50%;

	pointer-events: none;
}

.calculadora-filtro-combinacoes::after {
	content: "";

	position: absolute;

	left: 29px;
	bottom: 17px;

	width: 8px;
	height: 2px;

	border-radius: 2px;

	background: var(--sg-texto-suave);

	transform: rotate(45deg);
	transform-origin: left center;

	pointer-events: none;
}

.calculadora-filtro-combinacoes:focus-within::before {
	border-color: var(--sg-roxo);
}

.calculadora-filtro-combinacoes:focus-within::after {
	background: var(--sg-roxo);
}


/* =========================================================
   CABEÇALHO DAS COMBINAÇÕES
   ========================================================= */

.calculadora-combinacoes-cabecalho {
	display: flex;

	align-items: center;
	justify-content: space-between;

	gap: 14px;

	margin-bottom: 16px;
}

.calculadora-combinacoes-total,
.calculadora-combinacoes-exibindo {
	margin: 0;
}

.calculadora-combinacoes-total {
	color: var(--sg-texto-secundario);

	font-size: 18px;
	line-height: 1.5;
	font-weight: 500;
}

.calculadora-combinacoes-exibindo {
	padding: 6px 11px;

	border-radius: 999px;

	background: rgba(135, 88, 245, 0.10);
	color: var(--sg-roxo);

	font-size: 13px;
	line-height: 1.4;
	font-weight: 800;

	white-space: nowrap;
}


/* =========================================================
   LISTA DE COMBINAÇÕES
   ========================================================= */

.calculadora-combinacoes {
	display: grid;

	gap: 14px;
}

.calculadora-combinacao {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		50px
		minmax(0, 1fr);

	gap: 18px;

	align-items: center;

	padding: 18px;

	border: 1px solid #e8e9ee;
	border-radius: 20px;

	background:
		linear-gradient(
			180deg,
			rgba(255, 255, 255, 0.96),
			rgba(249, 249, 253, 0.96)
		);

	box-shadow:
		0 6px 20px rgba(18, 24, 40, 0.03);

	transition:
		border-color 0.2s ease,
		background-color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.calculadora-combinacao:hover {
	border-color: rgba(135, 88, 245, 0.26);

	background: #ffffff;

	box-shadow:
		0 12px 28px rgba(18, 24, 40, 0.055);

	transform: translateY(-1px);
}


/* =========================================================
   PAL NAS COMBINAÇÕES
   ========================================================= */

.calculadora-combinacao-pal {
	display: flex;

	min-width: 0;

	align-items: center;

	gap: 12px;
}

.calculadora-combinacao-pal img {
	width: 72px;
	height: 72px;

	flex: 0 0 72px;

	padding: 4px;

	object-fit: contain;

	background:
		radial-gradient(
			circle at 30% 30%,
			#ffffff 0%,
			#faf6ff 100%
		);

	border: 2px solid rgba(135, 88, 245, 0.28);
	border-radius: 50%;

	box-shadow:
		0 0 0 3px rgba(135, 88, 245, 0.05);
}

.calculadora-combinacao-info {
	min-width: 0;
}

.calculadora-combinacao-numero {
	display: block;

	margin-bottom: 3px;

	color: var(--sg-roxo);

	font-size: 13px;
	font-weight: 800;
}

.calculadora-combinacao-nome {
	display: block;

	overflow: hidden;

	color: var(--sg-texto);

	font-size: 18px;
	line-height: 1.25;
	font-weight: 800;

	text-overflow: ellipsis;
	white-space: nowrap;
}

.calculadora-combinacao-operador {
	display: flex;

	align-items: center;
	justify-content: center;

	width: 50px;
	height: 50px;

	margin: 0 auto;

	border-radius: 50%;

	background: rgba(135, 88, 245, 0.08);
	color: var(--sg-roxo);

	font-size: 30px;
	line-height: 1;
	font-weight: 500;

	box-shadow:
		inset 0 0 0 1px rgba(135, 88, 245, 0.10);
}


/* =========================================================
   MOSTRAR MAIS
   ========================================================= */

.calculadora-mostrar-mais-area {
	display: flex;

	justify-content: center;

	margin-top: 20px;
}

.calculadora-mostrar-mais {
	width: 100%;
	max-width: 320px;
	min-height: 54px;

	padding: 12px 24px;

	border: 1px solid var(--sg-roxo);
	border-radius: 16px;

	background: linear-gradient(
		135deg,
		#9868ff 0%,
		#8758f5 100%
	);
	color: #ffffff;

	font-family: inherit;
	font-size: 15px;
	font-weight: 800;

	cursor: pointer;

	box-shadow:
		0 10px 24px rgba(135, 88, 245, 0.22);

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.calculadora-mostrar-mais:hover {
	border-color: var(--sg-roxo-hover);

	background: linear-gradient(
		135deg,
		#8e5efe 0%,
		#7747eb 100%
	);

	box-shadow:
		0 14px 28px rgba(135, 88, 245, 0.28);

	transform: translateY(-1px);
}

.calculadora-mostrar-mais:active {
	transform: translateY(0);
}

.calculadora-mostrar-mais:focus-visible {
	outline: 3px solid var(--sg-roxo-borda);
	outline-offset: 2px;
}


/* =========================================================
   PALS MAIS PESQUISADOS
   ========================================================= */

.savegame-pals-populares {
	width: 100%;

	margin: 0;
	padding:
		22px
		28px
		24px;

	border-top: 1px solid var(--sg-borda);

	background:
		linear-gradient(
			180deg,
			rgba(135, 88, 245, 0.03),
			rgba(255, 255, 255, 0)
		);
}

.savegame-pals-populares-titulo {
	position: relative;

	margin-bottom: 16px;
	padding-left: 14px;
}

.savegame-pals-populares-titulo::before {
	content: "";

	position: absolute;

	top: 1px;
	bottom: 1px;
	left: 0;

	width: 4px;

	border-radius: 999px;

	background: var(--sg-roxo);
}

.savegame-pals-populares-titulo span {
	color: #50566a;

	font-size: 13px;
	line-height: 1.4;
	font-weight: 900;

	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.savegame-pals-populares-lista {
	display: flex;

	flex-wrap: wrap;

	gap: 10px;
}

.savegame-pal-popular {
	display: inline-flex;

	min-height: 46px;

	align-items: center;

	gap: 9px;

	padding:
		5px
		14px
		5px
		6px;

	border: 1px solid #e0e3ea;
	border-radius: 999px;

	background: rgba(255, 255, 255, 0.95);
	color: #23262f;

	font-size: 15px;
	line-height: 1.3;
	font-weight: 700;

	text-decoration: none !important;

	box-shadow:
		0 4px 12px rgba(18, 24, 40, 0.03);

	transition:
		border-color 0.2s ease,
		background-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.savegame-pal-popular img {
	width: 34px;
	height: 34px;

	flex: 0 0 34px;

	padding: 2px;

	object-fit: contain;

	border: 2px solid rgba(135, 88, 245, 0.32);
	border-radius: 50%;

	background:
		radial-gradient(
			circle at 30% 30%,
			#ffffff 0%,
			#faf6ff 100%
		);
}

.savegame-pal-popular:hover {
	border-color: rgba(135, 88, 245, 0.44);

	background: #ffffff;
	color: var(--sg-roxo);

	box-shadow:
		0 8px 18px rgba(135, 88, 245, 0.12);

	transform: translateY(-1px);
}


/* =========================================================
   MODAL
   ========================================================= */

.calculadora-modal {
	position: fixed;
	z-index: 99999;

	inset: 0;

	display: flex;

	align-items: center;
	justify-content: center;

	padding: 20px;
}

.calculadora-modal[hidden] {
	display: none;
}

.calculadora-modal-fundo {
	position: absolute;

	inset: 0;

	background: rgba(15, 18, 26, 0.58);

	backdrop-filter: blur(3px);
}

.calculadora-modal-conteudo {
	position: relative;
	z-index: 1;

	display: flex;

	width: 100%;
	max-width: 680px;
	max-height: 84vh;

	flex-direction: column;

	overflow: hidden;

	border: 1px solid var(--sg-borda);
	border-radius: 22px;

	background: #ffffff;

	box-shadow:
		0 28px 80px rgba(18, 24, 40, 0.24);
}


/* =========================================================
   TOPO DO MODAL
   ========================================================= */

.calculadora-modal-topo {
	display: flex;

	align-items: center;
	justify-content: space-between;

	gap: 16px;

	padding: 18px 22px;

	border-bottom: 1px solid var(--sg-borda);
}

.calculadora-modal-topo h2 {
	margin: 0;

	color: var(--sg-texto);

	font-size: 22px;
	line-height: 1.3;
	font-weight: 800;
}

.calculadora-modal-fechar {
	display: flex;

	width: 46px;
	height: 46px;

	flex: 0 0 46px;

	align-items: center;
	justify-content: center;

	padding: 0;

	border: 0;
	border-radius: 50%;

	background: #f5f6fb;
	color: var(--sg-texto-secundario);

	font-family: inherit;
	font-size: 30px;
	line-height: 1;

	cursor: pointer;

	transition:
		background-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease;
}

.calculadora-modal-fechar:hover {
	background: rgba(135, 88, 245, 0.10);
	color: var(--sg-roxo);

	transform: rotate(90deg);
}

.calculadora-modal-fechar:focus-visible {
	outline: 3px solid var(--sg-roxo-borda);
	outline-offset: 2px;
}


/* =========================================================
   PESQUISA DO MODAL
   ========================================================= */

.calculadora-pesquisa {
	padding: 15px 22px;

	border-bottom: 1px solid var(--sg-borda);
}

.calculadora-pesquisa input {
	width: 100%;
	min-height: 54px;

	padding: 12px 16px;

	border: 1px solid var(--sg-borda-forte);
	border-radius: 16px;

	background: #ffffff;
	color: var(--sg-texto);

	font-family: inherit;
	font-size: 16px;

	outline: none;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}

.calculadora-pesquisa input::placeholder {
	color: var(--sg-texto-suave);
}

.calculadora-pesquisa input:focus {
	border-color: var(--sg-roxo);

	box-shadow:
		0 0 0 3px var(--sg-roxo-claro);
}


/* =========================================================
   LISTA DE PALS NO MODAL
   ========================================================= */

.calculadora-lista-pals {
	overflow-y: auto;

	padding: 8px 0;

	scrollbar-width: thin;
	scrollbar-color:
		var(--sg-roxo-borda)
		transparent;
}

.calculadora-lista-pal {
	display: flex;

	width: 100%;

	align-items: center;

	gap: 14px;

	padding: 12px 22px;

	border: 0;

	background: #ffffff;
	color: var(--sg-texto);

	font-family: inherit;
	text-align: left;

	cursor: pointer;

	transition:
		background-color 0.15s ease;
}

.calculadora-lista-pal:hover {
	background: rgba(135, 88, 245, 0.07);
}

.calculadora-lista-pal:focus-visible {
	outline: 2px solid var(--sg-roxo);
	outline-offset: -2px;
}

.calculadora-lista-pal img {
	width: 60px;
	height: 60px;

	flex: 0 0 60px;

	padding: 3px;

	object-fit: contain;

	background:
		radial-gradient(
			circle at 30% 30%,
			#ffffff 0%,
			#faf6ff 100%
		);

	border: 2px solid rgba(135, 88, 245, 0.26);
	border-radius: 50%;

	box-shadow:
		0 0 0 2px rgba(135, 88, 245, 0.05);
}

.calculadora-lista-pal-info {
	min-width: 0;
}

.calculadora-lista-pal-numero {
	display: block;

	margin-bottom: 3px;

	color: var(--sg-roxo);

	font-size: 13px;
	font-weight: 800;
}

.calculadora-lista-pal-nome {
	display: block;

	color: var(--sg-texto);

	font-size: 17px;
	line-height: 1.3;
	font-weight: 800;
}


/* =========================================================
   ESTADOS
   ========================================================= */

.calculadora-carregando,
.calculadora-erro,
.calculadora-sem-resultados {
	margin: 0;

	padding: 28px 22px;

	color: var(--sg-texto-secundario);

	font-size: 15px;
	line-height: 1.7;

	text-align: center;
}

.calculadora-erro {
	color: #c62828;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.calculadora-palworld {
		padding: 10px 0 28px;
	}

	.calculadora-modos {
		display: flex;

		width: 100%;
	}

	.calculadora-modo {
		flex: 1;

		min-width: 0;

		padding-left: 10px;
		padding-right: 10px;

		font-size: 14px;
	}

	.calculadora-caixa {
		border-radius: 20px;
	}

	.calculadora-painel {
		padding: 18px;
	}

	.calculadora-pais {
		grid-template-columns: minmax(0, 1fr);

		gap: 14px;
	}

	.calculadora-operador {
		width: 48px;
		height: 48px;

		margin: 2px auto;

		font-size: 28px;
	}

	.calculadora-seletor-pal {
		min-height: 94px;

		padding: 14px;
	}

	.calculadora-pal-placeholder {
		font-size: 16px;
	}

	.calculadora-pal-selecionado {
		gap: 12px;
	}

	.calculadora-pal-selecionado img {
		width: 68px;
		height: 68px;

		flex-basis: 68px;
	}

	.calculadora-pal-nome {
		font-size: 18px;

		white-space: normal;
	}

	.calculadora-resultado-vazio {
		font-size: 16px;
		line-height: 1.6;
	}

	.calculadora-filho-resultado {
		max-width: none;

		padding: 16px;

		gap: 14px;

		border-radius: 18px;
	}

	.calculadora-filho-resultado img {
		width: 84px;
		height: 84px;

		flex-basis: 84px;
	}

	.calculadora-filho-resultado-nome {
		font-size: 24px;
		line-height: 1.2;
	}

	.calculadora-filho-escolha,
	.calculadora-filtro-combinacoes {
		max-width: none;
	}

	.calculadora-combinacoes-cabecalho {
		align-items: flex-start;
		flex-direction: column;

		gap: 8px;
	}

	.calculadora-combinacoes-total {
		font-size: 16px;
	}

	.calculadora-combinacao {
		grid-template-columns:
			minmax(0, 1fr)
			34px
			minmax(0, 1fr);

		gap: 8px;

		padding: 14px 10px;
	}

	.calculadora-combinacao-pal {
		flex-direction: column;

		align-items: center;
		justify-content: center;

		gap: 8px;

		text-align: center;
	}

	.calculadora-combinacao-pal img {
		width: 74px;
		height: 74px;

		flex-basis: 74px;
	}

	.calculadora-combinacao-info {
		width: 100%;
		min-width: 0;

		text-align: center;
	}

	.calculadora-combinacao-numero,
	.calculadora-combinacao-nome {
		text-align: center;
	}

	.calculadora-combinacao-nome {
		overflow: visible;

		font-size: 15px;
		line-height: 1.3;

		text-overflow: unset;
		white-space: normal;

		overflow-wrap: anywhere;
	}

	.calculadora-combinacao-operador {
		width: 34px;
		height: 34px;

		font-size: 24px;
	}

	.calculadora-mostrar-mais {
		max-width: none;
	}

	.savegame-pals-populares {
		padding:
			18px
			18px
			20px;
	}

	.savegame-pals-populares-lista {
		gap: 8px;
	}

	.savegame-pal-popular {
		min-height: 42px;

		padding-right: 10px;

		font-size: 13px;
	}

	.savegame-pal-popular img {
		width: 30px;
		height: 30px;

		flex-basis: 30px;
	}

	.calculadora-modal {
		align-items: flex-end;

		padding: 0;
	}

	.calculadora-modal-conteudo {
		max-width: none;
		max-height: 88vh;

		border-radius: 22px 22px 0 0;
	}

	.calculadora-modal-topo {
		padding: 16px 18px;
	}

	.calculadora-modal-topo h2 {
		font-size: 20px;
	}

	.calculadora-pesquisa {
		padding: 14px 18px;
	}

	.calculadora-lista-pal {
		padding: 12px 18px;
	}

	.calculadora-lista-pal img {
		width: 56px;
		height: 56px;

		flex-basis: 56px;
	}

	.calculadora-lista-pal-nome {
		font-size: 16px;
	}

}


/* =========================================================
   TELAS MUITO PEQUENAS
   ========================================================= */

@media (max-width: 380px) {

	.calculadora-modo {
		font-size: 13px;
	}

	.calculadora-painel {
		padding: 15px;
	}

	.calculadora-filho-resultado-nome {
		font-size: 22px;
	}

	.calculadora-combinacao {
		grid-template-columns:
			minmax(0, 1fr)
			28px
			minmax(0, 1fr);

		padding-left: 8px;
		padding-right: 8px;
	}

	.calculadora-combinacao-pal img {
		width: 66px;
		height: 66px;

		flex-basis: 66px;
	}

	.calculadora-combinacao-nome {
		font-size: 14px;
	}

}