body {
	margin: 0;
	font-family: Arial, sans-serif;
	background: #111827;
	color: white;
}

#app {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
}

.tela {
	display: none;
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 16px;
	padding: 30px;
	max-width: 1000px;
	width: 100%;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.tela.ativa {
	display: block;
}

h1 {
	font-size: 48px;
	margin-bottom: 10px;
}

h2 {
	font-size: 36px;
	margin-top: 0;
}

p {
	font-size: 18px;
	color: #d1d5db;
}

button {
	background: #facc15;
	color: #111827;
	border: none;
	border-radius: 10px;
	padding: 14px 24px;
	font-size: 18px;
	font-weight: bold;
	cursor: pointer;
	margin-top: 20px;
}

button:hover {
	background: #fde047;
}

.cartas {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 92px;
	gap: 8px;
	margin-top: 8px;
	margin-bottom: 8px;
}

.carta {
	background: #374151;
	border: 2px solid #4b5563;
	border-radius: 12px;
	padding: 8px;
	width: auto;
	height: 92px;
	min-height: 0;
	cursor: pointer;
	transition: transform 0.15s, border-color 0.15s;
	box-sizing: border-box;
	overflow: hidden;
	align-items: flex-start;
}

.carta:hover {
	transform: scale(1.04);
	border-color: #facc15;
}

.carta.selecionada {
	border-color: #facc15;
	background: #4b5563;
	transform: scale(1.04);
}

.campo-formacao {
	background:
		linear-gradient(
			to bottom,
			#1f3554 0%,
			#1f3554 12.5%,
			#2b466d 12.5%,
			#2b466d 25%,
			#1f3554 25%,
			#1f3554 37.5%,
			#2b466d 37.5%,
			#2b466d 50%,
			#1f3554 50%,
			#1f3554 62.5%,
			#2b466d 62.5%,
			#2b466d 75%,
			#1f3554 75%,
			#1f3554 87.5%,
			#2b466d 87.5%,
			#2b466d 100%
		);
	border: 5px solid #0f172a;
	border-radius: 18px;
	padding: 18px 14px;
	margin: 12px auto;
	max-width: 420px;
	min-height: 500px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 10px;
	position: relative;
	box-shadow:
		inset 0 0 0 3px rgba(255, 255, 255, 0.65),
		0 12px 24px rgba(0, 0, 0, 0.35);
	overflow: hidden;
}

.linha-campo {
	display: flex;
	justify-content: center;
	gap: 14px;
	position: relative;
	z-index: 2;
}

.posicao-campo {
	background: rgba(17, 24, 39, 0.92);
	border: 2px solid #ffffff;
	border-radius: 999px;
	color: white;
	width: 82px;
	min-width: 82px;
	min-height: 82px;
	padding: 8px 6px;
	cursor: pointer;
	font-weight: bold;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
	font-size: 13px;
}

.posicao-campo span {
	display: block;
	font-size: 13px;
	color: #facc15;
	margin-bottom: 4px;
}

.posicao-campo.ocupada {
	border-color: #facc15;
	background: rgba(55, 65, 81, 0.96);
	cursor: default;
}

.carta h3 {
	margin: 0 0 6px 0;
	font-size: 18px;
}

.carta p {
	margin: 3px 0;
	font-size: 13px;
}

#lista-elenco {
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 8px;
	min-height: 55px;
	max-height: 55px;
	overflow-y: auto;
	box-sizing: border-box;
}

.draft-direita > h3:nth-of-type(2) {
	height: 22px;
	line-height: 22px;
	margin: 8px 0 8px 0;
	text-align: center;
}

#lista-elenco li {
	background: #111827;
	border: 1px solid #4b5563;
	border-radius: 8px;
	padding: 8px 12px;
}

table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 20px;
	background: #111827;
}

th, td {
	border: 1px solid #374151;
	padding: 10px;
	text-align: center;
}

th {
	background: #374151;
	color: #facc15;
}
.escondido {
	display: none;
}

label {
	display: block;
	margin-top: 20px;
	margin-bottom: 8px;
	font-size: 18px;
	color: #d1d5db;
}

input:not([type="checkbox"]),
select {
	background: #111827;
	color: white;
	border: 2px solid #374151;
	border-radius: 10px;
	padding: 12px;
	font-size: 18px;
	text-align: center;
	width: 260px;
	max-width: 100%;
	box-sizing: border-box;
}

select {
	cursor: pointer;
}

input:focus,
select:focus {
	outline: none;
	border-color: #facc15;
}

input[type="checkbox"] {
	width: auto;
	margin-right: 8px;
	transform: scale(1.2);
	cursor: pointer;
}

label input[type="checkbox"] {
	vertical-align: middle;
}

#tela-draft {
	max-width: 1200px;
	text-align: left;
}

.draft-layout {
	display: flex;
	gap: 24px;
	align-items: flex-start;
	justify-content: center;
}

.draft-coluna {
	flex: 1;
}

.draft-esquerda {
	flex: 0 0 500px;
	max-width: 500px;
}

.draft-direita {
	flex: 0 0 520px;
	max-width: 520px;
	min-width: 0;
	height: 582px;
	display: flex;
	flex-direction: column;
}

.draft-esquerda h3,
.draft-direita > h3:first-of-type {
	height: 24px;
	line-height: 24px;
	margin: 0 0 12px 0;
	text-align: center;
}

.draft-direita #botao-resortear,
.draft-direita #botao-simular {
	display: block;
	margin-left: 0;
}

@media (max-width: 900px) {
	.draft-layout {
		flex-direction: column;
	}

	.draft-esquerda {
		max-width: 100%;
	}
}

.campo-formacao::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	height: 3px;
	background: rgba(255, 255, 255, 0.6);
	transform: translateY(-50%);
}

.campo-formacao::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 110px;
	height: 110px;
	border: 3px solid rgba(255, 255, 255, 0.6);
	border-radius: 50%;
	transform: translate(-50%, -50%);
}

.area-campo-topo,
.area-campo-baixo {
	position: absolute;
	left: 50%;
	width: 170px;
	height: 70px;
	border: 3px solid rgba(255, 255, 255, 0.6);
	transform: translateX(-50%);
	pointer-events: none;
}

.area-campo-topo {
	top: 0;
	border-top: none;
}

.area-campo-baixo {
	bottom: 0;
	border-bottom: none;
}

.trave-campo-topo,
.trave-campo-baixo {
	position: absolute;
	left: 50%;
	width: 90px;
	height: 12px;
	background: rgba(255, 255, 255, 0.9);
	border-radius: 0 0 8px 8px;
	transform: translateX(-50%);
	z-index: 1;
}

.trave-campo-topo {
	top: 0;
}

.trave-campo-baixo {
	bottom: 0;
	border-radius: 8px 8px 0 0;
}

#tela-draft > h2,
#tela-draft > #info-draft {
	text-align: center;
}

.draft-esquerda h3,
.draft-direita h3 {
	text-align: center;
}

.draft-direita {
	flex: 0 0 520px;
	max-width: 520px;
	height: 582px;
	background: transparent;
	border: none;
	border-radius: 0;
	padding: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.draft-direita .cartas {
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 8px;
	min-height: 0;
	height: 310px;
	margin: 0 0 8px 0;
	box-sizing: border-box;
	flex: 0 0 310px;
	overflow: hidden;
}

#botao-resortear {
	width: 100%;
	height: 39px;
	margin: 0 0 8px 0;
	padding: 8px 16px;
	font-size: 16px;
}

#botao-simular {
	width: 100%;
	height: 39px;
	margin: 8px 0 0 0;
	padding: 8px 16px;
	font-size: 16px;
}

#lista-elenco {
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 8px;
	min-height: 55px;
	max-height: 90px;
	overflow-y: auto;
	box-sizing: border-box;
}

#lista-elenco li {
	background: #111827;
	border: 1px solid #4b5563;
	border-radius: 8px;
	padding: 5px 8px;
	font-size: 12px;
}

#tela-draft {
	padding: 20px;
}

#tela-draft h2 {
	font-size: 30px;
	margin-bottom: 6px;
}

#tela-draft p {
	margin-top: 0;
	margin-bottom: 12px;
}

#tela-draft h3 {
	margin-top: 8px;
	margin-bottom: 8px;
}

.carta {
	display: flex;
	align-items: center;
	gap: 10px;
	text-align: left;
}

.carta-foto {
	width: 46px;
	min-width: 46px;
	height: 46px;
	border-radius: 6px;
	background: #9ca3af;
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
}

.carta-info {
	flex: 1;
	min-width: 0;
}

.carta-info h3 {
	margin: 0 0 5px 0;
	font-size: 15px;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.carta-info p {
	margin: 2px 0;
	font-size: 13px;
	color: #d1d5db;
	line-height: 1.1;
}

#tela-elencos {
	width: 1180px;
	max-width: calc(100vw - 20px);
	height: calc(100vh - 20px);
	max-height: 650px;
	background: #f4f1e8;
	color: #000000;
	text-align: left;
	padding: 14px 12px;
	box-sizing: border-box;
	overflow: hidden;
}

.cabecalho-elencos p {
	margin: 0;
	color: #6b5f36;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 0.5px;
}

.cabecalho-elencos h2 {
	margin: 2px 0 8px 0;
	color: #000000;
	font-size: 30px;
	line-height: 1;
}

.elencos-layout {
	display: flex;
	gap: 18px;
	height: calc(100% - 52px);
	align-items: stretch;
}

.lista-times-elencos {
	width: 180px;
	min-width: 180px;
	height: 100%;
	overflow-y: auto;
	padding-right: 4px;
	box-sizing: border-box;
}

.botao-time-elenco {
	width: 100%;
	min-height: 42px;
	margin-bottom: 5px;
	padding: 8px 12px;
	background: #f4f1e8;
	color: #000000;
	border: 1px solid #d8d2c4;
	border-radius: 4px;
	text-align: left;
	font-size: 14px;
	font-weight: bold;
	cursor: pointer;
}

.botao-time-elenco:hover {
	background: #e8e1d1;
}

.botao-time-elenco.selecionado {
	background: #1f7a4d;
	color: #ffffff;
	border-color: #1f7a4d;
}

.visual-elenco {
	flex: 1;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	overflow: hidden;
}

#nome-time-elenco {
	margin: 0 0 6px 0;
	color: #1f7a4d;
	font-size: 22px;
	line-height: 1;
	font-weight: bold;
	text-align: center;
}

.campo-elenco {
	width: 340px;
	max-width: 340px;
	min-height: 475px;
	height: 475px;
	margin: 0 auto;
	padding: 12px 10px;
	box-sizing: border-box;
}

.overall-time-elenco {
	margin: 8px 0 6px 0;
	color: #000000;
	font-size: 15px;
	font-weight: bold;
	text-align: center;
}

#botao-simular-elencos {
	width: 220px;
	margin: 0;
	padding: 9px 14px;
	font-size: 15px;
}

.campo-elenco .linha-campo {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	z-index: 2;
}

.jogador-campo-elenco {
	width: 82px;
	min-height: 54px;
	padding: 6px 5px;
	background: #f9fafb;
	color: #111827;
	border: 2px solid #111827;
	border-radius: 8px;
	box-sizing: border-box;
	text-align: center;
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
}

.jogador-campo-elenco strong {
	display: block;
	margin-bottom: 3px;
	font-size: 18px;
	line-height: 1;
	color: #111827;
}

.jogador-campo-elenco span {
	display: block;
	font-size: 10px;
	font-weight: bold;
	line-height: 1.05;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-elencos {
	max-height: 650px;
	padding: 12px;
}

.elencos-layout {
	height: calc(100% - 50px);
}

.visual-elenco {
	justify-content: flex-start;
}

#nome-time-elenco {
	margin: 0 0 4px 0;
	font-size: 22px;
}

.formacao-time-elenco {
	margin: 0 0 6px 0;
	color: #111827;
	font-size: 15px;
	font-weight: bold;
	text-align: center;
}

.campo-elenco {
	width: 330px;
	max-width: 330px;
	min-height: 420px;
	height: 420px;
	margin: 0 auto;
	padding: 10px 8px;
}

.campo-elenco .linha-campo {
	gap: 7px;
}

.jogador-campo-elenco {
	width: 80px;
	min-height: 50px;
	padding: 5px 4px;
}

.jogador-campo-elenco strong {
	font-size: 17px;
	margin-bottom: 2px;
}

.jogador-campo-elenco span {
	font-size: 9px;
}

.overall-time-elenco {
	margin: 6px 0 5px 0;
	font-size: 14px;
}

#botao-simular-elencos {
	display: block;
	width: 220px;
	margin: 0 auto;
	padding: 8px 12px;
	font-size: 15px;
}

.posicao-campo.destacada {
	border-color: #ffd84d;
	background: rgba(255, 216, 77, 0.22);
	box-shadow: 0 0 14px rgba(255, 216, 77, 0.95);
	transform: scale(1.05);
}

.posicao-campo.destacada:hover {
	background: rgba(255, 216, 77, 0.35);
}

#tela-jogo {
	width: 1200px;
	max-width: calc(100vw - 20px);
	height: calc(100vh - 20px);
	max-height: 680px;
	padding: 14px;
	box-sizing: border-box;
	text-align: left;
	overflow: hidden;
}

.jogo-topo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: #111827;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 10px 14px;
	margin-bottom: 12px;
	box-sizing: border-box;
}

.jogo-topo p {
	margin: 0;
	color: #facc15;
	font-size: 13px;
	font-weight: bold;
	letter-spacing: 0.5px;
}

.jogo-topo h2 {
	margin: 3px 0 0 0;
	font-size: 24px;
	line-height: 1;
	color: #ffffff;
}

.placar-principal {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	text-align: center;
	flex: 1;
}

.placar-principal span {
	color: #ffffff;
	font-size: 16px;
	font-weight: bold;
}

.placar-principal strong {
	min-width: 90px;
	color: #facc15;
	font-size: 28px;
	line-height: 1;
}

.tempo-jogo {
	min-width: 90px;
	text-align: center;
}

.tempo-jogo strong {
	display: block;
	margin-top: 2px;
	color: #ffffff;
	font-size: 24px;
	line-height: 1;
}

.jogo-layout {
	height: calc(100% - 86px);
	display: grid;
	grid-template-columns: 1.25fr 1fr 0.9fr;
	grid-template-rows: 1fr 0.75fr;
	gap: 10px;
}

.jogo-card {
	background: #111827;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 10px;
	box-sizing: border-box;
	overflow: hidden;
}

.jogo-card h3 {
	margin: 0 0 8px 0;
	color: #facc15;
	font-size: 17px;
	line-height: 1;
	text-align: center;
}

.jogo-feed-card {
	grid-row: 1 / 3;
}

.jogo-escalacoes-card {
	grid-column: 2 / 3;
	grid-row: 1 / 2;
}

.jogo-artilharia-card {
	grid-column: 3 / 4;
	grid-row: 2 / 3;
}

.jogo-resultados-card {
	grid-column: 2 / 3;
	grid-row: 2 / 3;
}

.jogo-tabela-card {
	grid-column: 3 / 4;
	grid-row: 1 / 2;
}

.feed-jogo {
	height: calc(100% - 72px);
	overflow-y: auto;
	background: #1f2937;
	border: 1px solid #374151;
	border-radius: 10px;
	padding: 8px;
	box-sizing: border-box;
}

.feed-jogo p {
	margin: 0 0 7px 0;
	color: #e5e7eb;
	font-size: 14px;
	line-height: 1.25;
}

.escalacoes-times {
	height: calc(100% - 26px);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.escala-time {
	background: #1f2937;
	border: 1px solid #374151;
	border-radius: 10px;
	padding: 8px;
	box-sizing: border-box;
	overflow: hidden;
}

.escala-time h4 {
	margin: 0 0 8px 0;
	color: #ffffff;
	font-size: 14px;
	line-height: 1.15;
	text-align: center;
}

.escala-time ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.escala-time li {
	margin-bottom: 5px;
	padding: 5px 6px;
	background: #111827;
	border-radius: 7px;
	color: #d1d5db;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.1;
}

#top-artilheiros {
	height: calc(100% - 26px);
	overflow-y: auto;
	margin: 0;
	padding-left: 24px;
	box-sizing: border-box;
}

#top-artilheiros li {
	margin-bottom: 6px;
	color: #d1d5db;
	font-size: 13px;
	line-height: 1.2;
}

#top-artilheiros li.artilheiro-usuario {
	color: #ffffff;
	font-weight: bold;
}

#resultados-rodada {
	height: calc(100% - 26px);
	overflow-y: auto;
	background: #1f2937;
	border: 1px solid #374151;
	border-radius: 10px;
	padding: 8px;
	box-sizing: border-box;
}

.resultado-rodada-item {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 6px;
	padding: 6px 8px;
	background: #111827;
	border-radius: 8px;
	color: #d1d5db;
	font-size: 13px;
	font-weight: bold;
}

.jogo-tabela-card table {
	margin-top: 0;
	font-size: 12px;
}

.jogo-tabela-card th,
.jogo-tabela-card td {
	padding: 5px 4px;
}

@media (max-width: 1000px) {
	#tela-jogo {
		height: auto;
		max-height: none;
		overflow: visible;
	}

	.jogo-topo {
		flex-direction: column;
		text-align: center;
	}

	.jogo-layout {
		height: auto;
		display: flex;
		flex-direction: column;
	}

	.jogo-card {
		min-height: 220px;
	}

	.jogo-feed-card {
		min-height: 320px;
	}
}

.placar-feed {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	background: #1f2937;
	border: 1px solid #374151;
	border-radius: 10px;
	padding: 8px 10px;
	margin-bottom: 8px;
	box-sizing: border-box;
}

.placar-feed .placar-principal {
	justify-content: flex-start;
	gap: 10px;
}

.placar-feed .placar-principal span {
	font-size: 15px;
}

.placar-feed .placar-principal strong {
	min-width: 76px;
	font-size: 26px;
}

.placar-feed .tempo-jogo {
	min-width: 74px;
}

.placar-feed .tempo-jogo p {
	font-size: 11px;
}

.placar-feed .tempo-jogo strong {
	font-size: 22px;
}

#top-artilheiros {
	height: calc(100% - 26px);
	overflow-y: auto;
	margin: 0;
	padding-left: 24px;
	box-sizing: border-box;
}

#tela-inicial {
	max-width: 720px;
	background:
		radial-gradient(circle at top, rgba(250, 204, 21, 0.16), transparent 38%),
		linear-gradient(145deg, #111827 0%, #1f2937 55%, #111827 100%);
	border: 2px solid rgba(250, 204, 21, 0.35);
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.55),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

#tela-inicial h1 {
	margin: 0 0 8px 0;
	color: #facc15;
	font-size: 52px;
	line-height: 1;
	text-shadow: 0 4px 18px rgba(250, 204, 21, 0.25);
}

#tela-inicial p {
	max-width: 560px;
	margin: 0 auto 18px auto;
	color: #e5e7eb;
	font-size: 17px;
	line-height: 1.45;
}

#tela-inicial label {
	max-width: 360px;
	margin: 16px auto 7px auto;
	color: #f9fafb;
	font-size: 15px;
	font-weight: bold;
	text-align: left;
}

#tela-inicial input:not([type="checkbox"]),
#tela-inicial select {
	display: block;
	width: 360px;
	max-width: 100%;
	margin: 0 auto;
	background: rgba(17, 24, 39, 0.95);
	border: 2px solid #4b5563;
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.25);
}
#tela-inicial input:not([type="checkbox"]):focus,
#tela-inicial select:focus {
	border-color: #facc15;
	box-shadow:
		0 0 0 3px rgba(250, 204, 21, 0.18),
		inset 0 2px 6px rgba(0, 0, 0, 0.25);
}

#tela-inicial #descricao-formacao {
	width: 360px;
	max-width: 100%;
	margin: 10px auto 0 auto;
	padding: 10px 12px;
	background: rgba(17, 24, 39, 0.65);
	border: 1px solid #374151;
	border-radius: 10px;
	color: #d1d5db;
	font-size: 14px;
	line-height: 1.35;
	box-sizing: border-box;
}

#tela-inicial button {
	width: 360px;
	max-width: 100%;
	margin-top: 20px;
	padding: 15px 24px;
	border-radius: 999px;
	font-size: 19px;
	box-shadow: 0 8px 0 #b45309;
	transition: transform 0.12s, box-shadow 0.12s, background 0.12s;
}

#tela-inicial button:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 0 #b45309;
}

#tela-inicial button:active {
	transform: translateY(4px);
	box-shadow: 0 4px 0 #b45309;
}

#tela-jogo {
	background: #1f2937;
	border-color: #4b5563;
}

.jogo-topo {
	background: #111827;
	border-color: #4b5563;
	padding: 12px 16px;
}

.jogo-topo h2 {
	font-size: 26px;
}

.placar-principal strong {
	font-size: 32px;
	color: #facc15;
}

.jogo-card {
	border-color: #4b5563;
}

.jogo-card h3 {
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid #374151;
}

.feed-jogo div {
	margin-bottom: 7px;
	padding: 7px 8px;
	background: #111827;
	border-radius: 7px;
	color: #e5e7eb;
	font-size: 14px;
	line-height: 1.25;
	text-align: left;
}

.feed-jogo div:empty {
	height: 10px;
	padding: 0;
	background: transparent;
}

.escala-time li {
	text-align: left;
}

.resultado-rodada-item {
	align-items: center;
}

.resultado-rodada-item span {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.resultado-rodada-item span:first-child {
	text-align: left;
}

.resultado-rodada-item span:last-child {
	text-align: right;
}

.resultado-rodada-item strong {
	min-width: 56px;
	text-align: center;
	color: #facc15;
}

#top-artilheiros li {
	padding: 5px 0;
}

.jogo-tabela-card table {
	font-size: 11px;
}

.jogo-tabela-card th,
.jogo-tabela-card td {
	padding: 5px 3px;
}

.jogo-resultados-card {
	padding: 8px;
}

.jogo-resultados-card h3 {
	margin-bottom: 6px;
	padding-bottom: 5px;
	font-size: 15px;
}

#resultados-rodada {
	height: calc(100% - 22px);
	padding: 5px;
	overflow-y: hidden;
}

.resultado-rodada-item {
	margin-bottom: 4px;
	padding: 5px 7px;
	font-size: 12px;
	line-height: 1.1;
}

.resultado-rodada-item strong {
	min-width: 50px;
	padding: 0 4px;
}

.feed-jogo div.evento-normal {
	margin-bottom: 5px;
	padding: 2px 4px;
	background: transparent;
	border-radius: 0;
	color: #ffffff;
	font-size: 14px;
	line-height: 1.25;
	text-align: left;
}

.feed-jogo div.evento-fase {
	margin-bottom: 7px;
	padding: 7px 8px;
	background: #111827;
	border-left: 3px solid #facc15;
	border-radius: 7px;
	color: #e5e7eb;
	font-size: 14px;
	line-height: 1.25;
	text-align: left;
	font-weight: bold;
}

#tela-jogo.modo-playoff {
	border-color: #facc15;
}

#tela-jogo.modo-playoff .jogo-topo {
	border-color: #facc15;
	background: #171717;
}

#tela-jogo.modo-playoff #jogo-rodada-label {
	color: #facc15;
}

#tela-jogo.modo-playoff #jogo-rodada-label::before {
	content: "🏆 ";
}

#tela-jogo.modo-playoff .jogo-resultados-card h3::before {
	content: "Mata-mata • ";
}

#tela-jogo.modo-final {
	border-color: #fde047;
	box-shadow: 0 0 28px rgba(250, 204, 21, 0.22);
}

#tela-jogo.modo-final .jogo-topo {
	border-color: #fde047;
}

#tela-jogo.modo-final #jogo-rodada-label::before {
	content: "👑 Final • ";
}

.jogo-topo > div:first-child {
	display: flex;
	flex-direction: column;
}

#jogo-titulo {
	order: 1;
	margin: 0;
}

#jogo-rodada-label {
	order: 2;
	margin-top: 6px;
	margin-bottom: 0;
	font-size: 13px;
}

.resultado-rodada-item .time-resultado {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.resultado-rodada-item .time-a-resultado {
	text-align: left;
}

.resultado-rodada-item .time-b-resultado {
	text-align: right;
}

.resultado-rodada-item .tempo-resultado-rodada {
	flex: 0 0 44px;
	max-width: 44px;
	padding: 2px 5px;
	background: #020617;
	border: 1px solid #374151;
	border-radius: 999px;
	color: #facc15;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	box-sizing: border-box;
}

#tela-jogo.ativa {
	display: flex;
	flex-direction: column;
}

#tela-jogo .jogo-topo {
	flex: 0 0 auto;
}

#tela-jogo .jogo-layout {
	flex: 1;
	height: auto;
	min-height: 0;
	overflow: hidden;
	padding-bottom: 2px;
	box-sizing: border-box;
}

#tela-jogo .jogo-card {
	min-height: 0;
}

#tela-jogo .jogo-card {
	display: flex;
	flex-direction: column;
}

#tela-jogo .jogo-card h3 {
	flex: 0 0 auto;
}

#tela-jogo .placar-feed {
	flex: 0 0 auto;
}

#tela-jogo .feed-jogo,
#tela-jogo #resultados-rodada,
#tela-jogo #top-artilheiros,
#tela-jogo .escalacoes-times {
	flex: 1;
	height: auto;
	min-height: 0;
	box-sizing: border-box;
}

#tela-jogo #top-artilheiros {
	padding-bottom: 4px;
}

#tela-jogo #resultados-rodada {
	padding-bottom: 6px;
}

#tela-jogo .feed-jogo {
	padding-bottom: 6px;
}

#tela-jogo .jogo-tabela-card {
	overflow: hidden;
}

#tela-jogo .jogo-tabela-card table {
	margin-bottom: 0;
}

.cabecalho-card-estrategia {
	position: relative;
	min-height: 28px;
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.cabecalho-card-estrategia h3 {
	margin: 0;
	padding: 0;
	border-bottom: none;
	text-align: center;
	line-height: 24px;
}

.botao-estrategia-card {
	position: absolute;
	top: 0;
	left: 0;
	height: 24px;
	margin: 0;
	padding: 3px 8px;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 8px;
	background: rgba(15, 23, 42, 0.9);
	color: #facc15;
	font-size: 11px;
	font-weight: 800;
	line-height: 16px;
	cursor: pointer;
}

.botao-estrategia-card:hover {
	background: rgba(30, 41, 59, 0.95);
}

#botao-voltar-escalacoes {
	left: auto;
	right: 0;
}

#conteudo-escalacoes,
#conteudo-estrategia {
	flex: 1;
	min-height: 0;
}

.conteudo-estrategia {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.aviso-estrategia {
	margin: 0 0 6px 0;
	color: #cbd5e1;
	font-size: 11px;
	line-height: 1.2;
	text-align: center;
}

.painel-estrategia-usuario {
	flex: 1;
	min-height: 0;
	max-height: none;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-right: 4px;
	box-sizing: border-box;
}

.bloco-estrategia {
	padding: 6px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 8px;
	background: rgba(15, 23, 42, 0.55);
}

.bloco-estrategia h4 {
	margin: 0 0 5px 0;
	color: #facc15;
	font-size: 11px;
	line-height: 1.1;
	text-align: center;
}

.linha-estrategia {
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 5px;
	align-items: center;
	margin-bottom: 4px;
}

.linha-estrategia:last-child {
	margin-bottom: 0;
}

.linha-estrategia span {
	color: #e5e7eb;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
}

.linha-estrategia select {
	width: 100%;
	height: 24px;
	padding: 2px 6px;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 7px;
	background: #0f172a;
	color: #f8fafc;
	font-size: 10px;
	font-weight: 700;
	text-align: left;
	box-sizing: border-box;
}

#conteudo-escalacoes.escondido,
#conteudo-estrategia.escondido {
	display: none !important;
}

#conteudo-escalacoes {
	flex: 1;
	min-height: 0;
}

#conteudo-estrategia {
	flex: 1;
	min-height: 0;
}

#conteudo-estrategia:not(.escondido) {
	display: flex;
	flex-direction: column;
}

.escala-time h4 {
	font-size: 12px;
	line-height: 1.05;
	margin-bottom: 6px;
}

.escala-time li {
	margin-bottom: 4px;
	padding: 4px 6px;
	font-size: 10px;
	line-height: 1.05;
}

.separador-estrategia {
	height: 1px;
	margin: 5px 0;
	background: rgba(250, 204, 21, 0.35);
}

.carta-raridade-bagre {
	border-color: #a16207;
}

.carta-raridade-cansado {
	border-color: #cbd5e1;
}

.carta-raridade-washed {
	border-color: #38bdf8;
}

.carta-raridade-em-forma {
	border-color: #a855f7;
}

.carta-raridade-inspirado {
	border-color: #f97316;
}

.carta-raridade-imparavel {
	border-color: #ef4444;
	box-shadow: 0 0 10px rgba(239, 68, 68, 0.25);
}

.carta-raridade-goat {
	border-color: #facc15;
	box-shadow: 0 0 14px rgba(250, 204, 21, 0.35);
}

.carta-raridade-bagre .texto-raridade {
	color: #a16207;
}

.carta-raridade-cansado .texto-raridade {
	color: #cbd5e1;
}

.carta-raridade-washed .texto-raridade {
	color: #38bdf8;
}

.carta-raridade-em-forma .texto-raridade {
	color: #a855f7;
}

.carta-raridade-inspirado .texto-raridade {
	color: #f97316;
}

.carta-raridade-imparavel .texto-raridade {
	color: #ef4444;
}

.carta-raridade-goat .texto-raridade {
	color: #facc15;
}

.texto-raridade {
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

.carta-raridade-bagre:hover,
.carta-raridade-cansado:hover,
.carta-raridade-washed:hover,
.carta-raridade-em-forma:hover,
.carta-raridade-inspirado:hover,
.carta-raridade-imparavel:hover,
.carta-raridade-goat:hover {
	border-color: #facc15;
}

.texto-raridade {
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

.texto-forca-draft {
	margin-top: 4px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.texto-forca-draft span {
	font-size: 18px;
	font-weight: 900;
	line-height: 1;
}

.forca-elite {
	color: #22d3ee;
}

.forca-excelente {
	color: #22c55e;
}

.forca-muito-boa {
	color: #facc15;
}

.forca-boa {
	color: #f97316;
}

.forca-media {
	color: #ef4444;
}

.forca-classica {
	color: #e5e7eb;
}

.texto-raridade-dificil {
	margin: 8px 0 4px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #e5e7eb;
}

.linha-modo {
	width: 100%;
	max-width: 360px;
	height: 56px;
	margin: 0 auto 16px;
	padding: 0 18px;
	display: grid;
	grid-template-columns: 1fr 22px;
	align-items: center;
	gap: 16px;
	background: rgba(8, 15, 35, 0.75);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 10px;
	box-sizing: border-box;
	cursor: pointer;
}

.texto-modo {
	display: block;
	width: 100%;
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	color: #ffffff;
	text-align: left;
	white-space: nowrap;
}

.linha-modo input[type="checkbox"] {
	width: 18px;
	min-width: 18px;
	max-width: 18px;
	height: 18px;
	min-height: 18px;
	max-height: 18px;
	margin: 0;
	padding: 0;
	justify-self: end;
	cursor: pointer;
	box-shadow: none;
	transform: none;
}

/* ========================= */
/* AJUSTE FINAL TELA DRAFT */
/* ========================= */

#tela-draft {
	width: 1240px;
	max-width: calc(100vw - 24px);
	min-height: auto;
	padding: 22px 28px 28px;
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 16px;
	box-sizing: border-box;
	text-align: center;
}

#tela-draft h2 {
	margin: 0 0 4px 0;
	font-size: 32px;
	line-height: 1;
	color: #ffffff;
}

#tela-draft > #info-draft {
	margin: 0 0 18px 0;
	font-size: 18px;
	color: #d1d5db;
	text-align: center;
}

#tela-draft > label {
	display: block;
	width: 260px;
	margin: 0 auto 6px auto;
	color: #f9fafb;
	font-size: 15px;
	font-weight: 700;
	text-align: left;
}

#tela-draft > select {
	display: block;
	width: 260px;
	height: 48px;
	margin: 0 auto;
	background: #111827;
	border: 2px solid #374151;
	border-radius: 10px;
	color: #ffffff;
	font-size: 18px;
	font-weight: 700;
	text-align: center;
	box-sizing: border-box;
}

#tela-draft > #descricao-formacao {
	width: 720px;
	max-width: 100%;
	margin: 8px auto 18px auto;
	color: #d1d5db;
	font-size: 16px;
	line-height: 1.25;
	text-align: center;
}

#tela-draft .draft-layout {
	display: grid !important;
	grid-template-columns: 460px 520px;
	align-items: start;
	justify-content: center;
	gap: 44px;
	width: 100%;
	margin: 0 auto;
}

#tela-draft .draft-esquerda,
#tela-draft .draft-direita {
	width: 100%;
	max-width: none;
	height: 578px;
	min-width: 0;
	box-sizing: border-box;
}

#tela-draft .draft-esquerda {
	display: flex;
	flex-direction: column;
	align-items: center;
}

#tela-draft .draft-direita {
	flex: none !important;
	display: flex !important;
	flex-direction: column;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}

#tela-draft .draft-esquerda > h3,
#tela-draft .draft-direita > h3:first-of-type {
	width: 100%;
	height: 26px;
	margin: 0 0 10px 0 !important;
	color: #ffffff;
	font-size: 20px;
	font-weight: 800;
	line-height: 26px;
	text-align: center;
}

#tela-draft .campo-formacao {
	width: 460px;
	max-width: 460px;
	height: 542px;
	min-height: 542px;
	margin: 0 auto !important;
	padding: 18px 14px;
	box-sizing: border-box;
}

#tela-draft .draft-direita .cartas {
	width: 100%;
	height: 318px !important;
	min-height: 318px !important;
	max-height: 318px !important;
	flex: 0 0 318px !important;
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 96px;
	gap: 8px;
	margin: 0 0 10px 0 !important;
	padding: 8px;
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
	overflow: hidden;
}

#tela-draft .carta {
	display: block !important;
	height: 96px !important;
	min-height: 96px !important;
	max-height: 96px !important;
	padding: 8px 10px !important;
	background: #374151;
	border-radius: 10px;
	box-sizing: border-box;
	overflow: hidden;
	text-align: left;
}

#tela-draft .carta:hover {
	transform: none;
}

#tela-draft .carta-info {
	width: 100%;
	min-width: 0;
}

#tela-draft .carta-info h3 {
	margin: 0 0 6px 0 !important;
	font-size: 15px !important;
	font-weight: 900;
	line-height: 1;
	color: #ffffff;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-draft .carta-info p {
	margin: 0 0 5px 0 !important;
	font-size: 13px !important;
	line-height: 1;
	color: #e5e7eb;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-draft .texto-raridade,
#tela-draft .texto-raridade-dificil {
	margin: 0 0 6px 0 !important;
	font-size: 13px !important;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

#tela-draft .texto-forca-draft {
	margin: 0 !important;
	font-size: 13px !important;
	font-weight: 800;
	line-height: 1;
	color: #ffffff;
}

#tela-draft .texto-forca-draft span {
	font-size: 20px !important;
	font-weight: 950;
	line-height: 1;
}

#botao-resortear {
	width: 100% !important;
	height: 40px;
	margin: 0 0 12px 0 !important;
	padding: 0 16px !important;
	border-radius: 10px;
	font-size: 16px !important;
	line-height: 40px;
}

#tela-draft .draft-direita > h3:nth-of-type(2) {
	width: 100%;
	height: 26px;
	margin: 0 0 10px 0 !important;
	color: #ffffff;
	font-size: 20px;
	font-weight: 800;
	line-height: 26px;
	text-align: center;
}

#lista-elenco {
	width: 100% !important;
	height: 54px !important;
	min-height: 54px !important;
	max-height: 54px !important;
	margin: 0 0 0 0 !important;
	padding: 8px !important;
	background: #1f2937;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
	overflow-y: auto;
}

#lista-elenco li {
	padding: 5px 8px;
	font-size: 12px;
	line-height: 1;
}

#botao-simular {
	width: 100% !important;
	height: 40px;
	margin: auto 0 0 0 !important;
	padding: 0 16px !important;
	border-radius: 10px;
	font-size: 16px !important;
	line-height: 40px;
}

@media (max-width: 1050px) {
	#tela-draft .draft-layout {
		grid-template-columns: 1fr;
		gap: 22px;
	}

	#tela-draft .draft-esquerda,
	#tela-draft .draft-direita {
		height: auto;
	}

	#tela-draft .campo-formacao {
		width: 100%;
		max-width: 460px;
	}

	#tela-draft .draft-direita {
		max-width: 520px;
		margin: 0 auto !important;
	}
}

/* ========================= */
/* AJUSTE FUNDO ESCOLHAS + ELENCO EM LINHA */
/* ========================= */

#tela-draft .draft-direita {
	background: #111827 !important;
	border: 2px solid #374151 !important;
	border-radius: 16px !important;
	padding: 10px !important;
	box-sizing: border-box;
}

#tela-draft .draft-direita .cartas {
	background: #1f2937 !important;
	border: 2px solid #374151 !important;
	box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.18);
}

#tela-draft #lista-elenco {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 8px !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	white-space: nowrap !important;
}

#tela-draft #lista-elenco li {
	flex: 0 0 auto !important;
	white-space: nowrap !important;
}

/* ========================= */
/* CORRIGIR CORES DAS RARIDADES NO DRAFT */
/* ========================= */

#tela-draft .carta-raridade-bagre .texto-raridade {
	color: #a16207 !important;
}

#tela-draft .carta-raridade-cansado .texto-raridade {
	color: #cbd5e1 !important;
}

#tela-draft .carta-raridade-washed .texto-raridade {
	color: #38bdf8 !important;
}

#tela-draft .carta-raridade-em-forma .texto-raridade {
	color: #a855f7 !important;
}

#tela-draft .carta-raridade-inspirado .texto-raridade {
	color: #f97316 !important;
}

#tela-draft .carta-raridade-imparavel .texto-raridade {
	color: #ef4444 !important;
}

#tela-draft .carta-raridade-goat .texto-raridade {
	color: #facc15 !important;
}

#tela-draft .texto-raridade-dificil {
	color: #e5e7eb !important;
}

/* ========================= */
/* RARIDADE NA TELA DE ELENCOS */
/* ========================= */

#tela-elencos .jogador-campo-elenco {
	min-height: 58px;
	padding: 4px 4px;
	overflow: hidden;
}

#tela-elencos .jogador-campo-elenco strong {
	margin-bottom: 2px;
	font-size: 16px;
	line-height: 1;
}

#tela-elencos .jogador-campo-elenco span {
	margin-bottom: 2px;
	font-size: 8px;
	line-height: 1;
}

#tela-elencos .texto-raridade-elenco {
	display: block;
	font-size: 7px;
	font-weight: 900;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-elencos .texto-raridade-dificil-elenco {
	color: #111827;
}

/* ========================= */
/* CORES DA RARIDADE NA TELA DE ELENCOS */
/* ========================= */

#tela-elencos .carta-raridade-bagre .texto-raridade {
	color: #a16207 !important;
}

#tela-elencos .carta-raridade-cansado .texto-raridade {
	color: #64748b !important;
}

#tela-elencos .carta-raridade-washed .texto-raridade {
	color: #0284c7 !important;
}

#tela-elencos .carta-raridade-em-forma .texto-raridade {
	color: #9333ea !important;
}

#tela-elencos .carta-raridade-inspirado .texto-raridade {
	color: #ea580c !important;
}

#tela-elencos .carta-raridade-imparavel .texto-raridade {
	color: #dc2626 !important;
}

#tela-elencos .carta-raridade-goat .texto-raridade {
	color: #ca8a04 !important;
}

/* ========================= */
/* VISUAL BONITÃO - TELA ELENCOS */
/* ========================= */

#tela-elencos {
	width: 1180px;
	max-width: calc(100vw - 24px);
	height: calc(100vh - 24px);
	max-height: 680px;
	padding: 16px;
	background: #111827;
	color: #ffffff;
	border: 2px solid #4b5563;
	border-radius: 18px;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.55),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
	text-align: left;
	box-sizing: border-box;
	overflow: hidden;
}

#tela-elencos .cabecalho-elencos {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 74px;
	margin-bottom: 14px;
	padding: 14px 18px;
	background: #0f172a;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
}

#tela-elencos .cabecalho-elencos p {
	margin: 0 0 4px 0;
	color: #facc15;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.6px;
	text-transform: uppercase;
}

#tela-elencos .cabecalho-elencos h2 {
	margin: 0;
	color: #ffffff;
	font-size: 30px;
	line-height: 1;
}

#tela-elencos .elencos-layout {
	display: grid;
	grid-template-columns: 210px 1fr;
	gap: 16px;
	height: calc(100% - 88px);
	align-items: stretch;
}

#tela-elencos .lista-times-elencos {
	width: 100%;
	min-width: 0;
	height: 100%;
	padding: 10px;
	background: #0f172a;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
	overflow-y: auto;
}

#tela-elencos .botao-time-elenco {
	width: 100%;
	min-height: 44px;
	margin: 0 0 8px 0;
	padding: 9px 12px;
	background: #1f2937;
	color: #f8fafc;
	border: 1px solid #374151;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 900;
	text-align: left;
	box-sizing: border-box;
	cursor: pointer;
	transition: transform 0.12s, border-color 0.12s, background 0.12s;
}

#tela-elencos .botao-time-elenco:hover {
	background: #263244;
	border-color: #facc15;
	transform: translateX(2px);
}

#tela-elencos .botao-time-elenco.selecionado {
	background: #facc15;
	color: #111827;
	border-color: #facc15;
	box-shadow: 0 0 14px rgba(250, 204, 21, 0.25);
}

#tela-elencos .visual-elenco {
	height: 100%;
	padding: 14px;
	background: #0f172a;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	overflow: hidden;
}

#tela-elencos #nome-time-elenco {
	margin: 0 0 4px 0;
	color: #facc15;
	font-size: 28px;
	font-weight: 950;
	line-height: 1;
	text-align: center;
	text-shadow: 0 0 14px rgba(250, 204, 21, 0.18);
}

#tela-elencos .formacao-time-elenco {
	margin: 0 0 10px 0;
	color: #e5e7eb;
	font-size: 15px;
	font-weight: 900;
	text-align: center;
}

#tela-elencos .campo-elenco {
	width: 390px;
	max-width: 390px;
	height: 455px;
	min-height: 455px;
	margin: 0 auto;
	padding: 14px 10px;
	border: 5px solid #020617;
	border-radius: 18px;
	box-shadow:
		0 14px 28px rgba(0, 0, 0, 0.48),
		inset 0 0 0 3px rgba(255, 255, 255, 0.65);
	box-sizing: border-box;
}

#tela-elencos .campo-elenco .linha-campo {
	gap: 9px;
}

#tela-elencos .jogador-campo-elenco {
	width: 86px;
	min-height: 62px;
	padding: 5px 4px;
	background: #111827;
	color: #ffffff;
	border: 2px solid #4b5563;
	border-radius: 10px;
	box-shadow:
		0 4px 0 rgba(0, 0, 0, 0.45),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
	box-sizing: border-box;
	text-align: center;
	overflow: hidden;
}

#tela-elencos .jogador-campo-elenco strong {
	display: block;
	margin: 0 0 3px 0;
	color: #ffffff;
	font-size: 17px;
	font-weight: 950;
	line-height: 1;
}

#tela-elencos .jogador-campo-elenco span {
	display: block;
	margin: 0 0 3px 0;
	color: #e5e7eb;
	font-size: 9px;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-elencos .texto-raridade-elenco {
	display: block;
	font-size: 7px;
	font-weight: 950;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#tela-elencos .overall-time-elenco {
	margin: 10px 0 8px 0;
	color: #ffffff;
	font-size: 16px;
	font-weight: 950;
	text-align: center;
}

#tela-elencos #botao-simular-elencos {
	width: 240px;
	height: 42px;
	margin: 0 auto;
	padding: 0 16px;
	background: #facc15;
	color: #111827;
	border-radius: 999px;
	font-size: 16px;
	font-weight: 950;
	line-height: 42px;
	box-shadow: 0 6px 0 #b45309;
}

#tela-elencos #botao-simular-elencos:hover {
	background: #fde047;
	transform: translateY(-1px);
	box-shadow: 0 7px 0 #b45309;
}

#tela-elencos #botao-simular-elencos:active {
	transform: translateY(3px);
	box-shadow: 0 3px 0 #b45309;
}

/* borda dos cards por raridade no elenco */
#tela-elencos .jogador-campo-elenco.carta-raridade-bagre {
	border-color: #a16207;
}

#tela-elencos .jogador-campo-elenco.carta-raridade-cansado {
	border-color: #94a3b8;
}

#tela-elencos .jogador-campo-elenco.carta-raridade-washed {
	border-color: #38bdf8;
}

#tela-elencos .jogador-campo-elenco.carta-raridade-em-forma {
	border-color: #a855f7;
}

#tela-elencos .jogador-campo-elenco.carta-raridade-inspirado {
	border-color: #f97316;
}

#tela-elencos .jogador-campo-elenco.carta-raridade-imparavel {
	border-color: #ef4444;
	box-shadow:
		0 4px 0 rgba(0, 0, 0, 0.45),
		0 0 12px rgba(239, 68, 68, 0.22);
}

#tela-elencos .jogador-campo-elenco.carta-raridade-goat {
	border-color: #facc15;
	box-shadow:
		0 4px 0 rgba(0, 0, 0, 0.45),
		0 0 14px rgba(250, 204, 21, 0.30);
}

/* cores da raridade no elenco */
#tela-elencos .carta-raridade-bagre .texto-raridade {
	color: #a16207 !important;
}

#tela-elencos .carta-raridade-cansado .texto-raridade {
	color: #cbd5e1 !important;
}

#tela-elencos .carta-raridade-washed .texto-raridade {
	color: #38bdf8 !important;
}

#tela-elencos .carta-raridade-em-forma .texto-raridade {
	color: #a855f7 !important;
}

#tela-elencos .carta-raridade-inspirado .texto-raridade {
	color: #f97316 !important;
}

#tela-elencos .carta-raridade-imparavel .texto-raridade {
	color: #ef4444 !important;
}

#tela-elencos .carta-raridade-goat .texto-raridade {
	color: #facc15 !important;
}

/* ========================= */
/* AJUSTE ELENCOS - BOTÃO TOPO + FORÇA ABAIXO DA FORMAÇÃO */
/* ========================= */

#tela-elencos {
	position: relative;
}

#tela-elencos #botao-simular-elencos {
	position: absolute;
	top: 44px;
	right: 52px;
	width: 220px;
	height: 48px;
	margin: 0 !important;
	padding: 0 18px !important;
	border-radius: 10px;
	font-size: 17px;
	line-height: 48px;
	z-index: 5;
}

#tela-elencos .visual-elenco {
	position: relative;
}

#tela-elencos #nome-time-elenco {
	order: 1;
}

#tela-elencos .formacao-time-elenco {
	order: 2;
	margin-bottom: 4px;
}

#tela-elencos .overall-time-elenco {
	order: 3;
	margin: 0 0 10px 0;
	color: #ffffff;
	font-size: 15px;
	font-weight: 950;
	text-align: center;
}

#tela-elencos .campo-elenco {
	order: 4;
}

#tela-elencos .campo-elenco {
	margin-top: 0;
}

/* ========================= */
/* BOTÃO INICIAR TEMPORADA NO CABEÇALHO DOS ELENCOS */
/* ========================= */

#tela-elencos #botao-simular-elencos {
	position: absolute;
	top: 38px;
	right: 52px;
	width: 220px;
	height: 44px;
	margin: 0 !important;
	padding: 0 18px !important;
	border-radius: 10px;
	font-size: 17px;
	line-height: 44px;
	z-index: 10;
}

/* ========================= */
/* CORREÇÃO REAL - BOTÃO NO CABEÇALHO DOS ELENCOS */
/* ========================= */

#tela-elencos {
	position: relative !important;
}

#tela-elencos .visual-elenco {
	position: static !important;
}

#tela-elencos #botao-simular-elencos {
	position: absolute !important;
	top: 34px !important;
	right: 70px !important;
	width: 240px !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 18px !important;
	border-radius: 10px !important;
	font-size: 17px !important;
	line-height: 44px !important;
	z-index: 50 !important;
}

/* ========================= */
/* PAINEL EXPANDIDO DE ESTRATÉGIA */
/* ========================= */

#tela-jogo {
	position: relative;
}

.painel-estrategia-expandido {
	position: absolute;
	inset: 88px 14px 14px 14px;
	z-index: 100;
	background: rgba(15, 23, 42, 0.96);
	border: 2px solid #facc15;
	border-radius: 16px;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.65),
		inset 0 0 0 1px rgba(255, 255, 255, 0.05);
	box-sizing: border-box;
	overflow: hidden;
}

.painel-estrategia-expandido.escondido {
	display: none !important;
}

.estrategia-expandida-card {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 14px;
	box-sizing: border-box;
	overflow: hidden;
}

.estrategia-expandida-topo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 14px;
	background: #111827;
	border: 1px solid #374151;
	border-radius: 12px;
	box-sizing: border-box;
}

.estrategia-expandida-topo p {
	margin: 0 0 4px 0;
	color: #facc15;
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.6px;
	text-transform: uppercase;
}

.estrategia-expandida-topo h3 {
	margin: 0;
	padding: 0;
	border: none;
	color: #ffffff;
	font-size: 24px;
	font-weight: 950;
	line-height: 1;
	text-align: left;
}

.botao-fechar-estrategia-expandida {
	width: auto;
	height: 38px;
	margin: 0;
	padding: 0 18px;
	background: #facc15;
	color: #111827;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 950;
	line-height: 38px;
}

.botao-fechar-estrategia-expandida:hover {
	background: #fde047;
}

.aviso-estrategia-expandida {
	margin: 10px 0;
	padding: 8px 12px;
	background: rgba(250, 204, 21, 0.08);
	border: 1px solid rgba(250, 204, 21, 0.25);
	border-radius: 10px;
	color: #e5e7eb;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	box-sizing: border-box;
}

.abas-estrategia {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin-bottom: 10px;
}

.botao-aba-estrategia {
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0 12px;
	background: #111827;
	color: #e5e7eb;
	border: 1px solid #374151;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 950;
	line-height: 40px;
	box-sizing: border-box;
}

.botao-aba-estrategia:hover {
	background: #1f2937;
	color: #ffffff;
}

.botao-aba-estrategia.ativo {
	background: #facc15;
	color: #111827;
	border-color: #facc15;
	box-shadow: 0 0 14px rgba(250, 204, 21, 0.22);
}

.painel-estrategia-expandido-conteudo {
	flex: 1;
	min-height: 0;
	padding: 0;
	overflow-y: auto;
	display: block;
	box-sizing: border-box;
}

.aba-estrategia-conteudo {
	display: none;
	height: 100%;
	min-height: 0;
}

.aba-estrategia-conteudo.ativa {
	display: block;
}

.grade-estrategia-uma-coluna {
	display: grid;
	grid-template-columns: minmax(0, 640px);
	justify-content: center;
	gap: 12px;
}

.grade-estrategia-duas-colunas {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.bloco-estrategia-expandido {
	padding: 12px;
	background: #111827;
	border: 1px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
	overflow: hidden;
}

.bloco-estrategia-expandido h4 {
	margin: 0 0 10px 0;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	color: #facc15;
	font-size: 16px;
	font-weight: 950;
	line-height: 1;
	text-align: center;
}

.linha-estrategia-expandida {
	display: grid;
	grid-template-columns: 74px 1fr;
	gap: 10px;
	align-items: center;
	margin-bottom: 8px;
	padding: 8px;
	background: #1f2937;
	border: 1px solid #374151;
	border-radius: 10px;
	box-sizing: border-box;
}

.linha-estrategia-expandida:last-child {
	margin-bottom: 0;
}

.linha-estrategia-expandida span {
	color: #f8fafc;
	font-size: 13px;
	font-weight: 950;
	line-height: 1;
	text-align: center;
}

.linha-estrategia-expandida select {
	width: 100%;
	height: 38px;
	padding: 0 10px;
	background: #0f172a;
	color: #ffffff;
	border: 1px solid #4b5563;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 850;
	text-align: left;
	box-sizing: border-box;
}

.linha-estrategia-expandida select:focus {
	border-color: #facc15;
	box-shadow: 0 0 0 3px rgba(250, 204, 21, 0.16);
}

.separador-estrategia-expandido {
	height: 1px;
	margin: 10px 0;
	background: rgba(250, 204, 21, 0.35);
}

@media (max-width: 1000px) {
	.painel-estrategia-expandido {
		position: fixed;
		inset: 10px;
	}

	.estrategia-expandida-card {
		padding: 10px;
	}

	.estrategia-expandida-topo {
		padding: 10px;
	}

	.estrategia-expandida-topo h3 {
		font-size: 22px;
	}

	.abas-estrategia {
		grid-template-columns: 1fr;
	}

	.grade-estrategia-uma-coluna,
	.grade-estrategia-duas-colunas {
		grid-template-columns: 1fr;
	}

	.linha-estrategia-expandida {
		grid-template-columns: 62px 1fr;
	}

	.linha-estrategia-expandida select {
		font-size: 13px;
	}
}

.grade-ligas {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	margin-top: 24px;
}

.botao-liga {
	padding: 18px 12px;
	border: 2px solid rgba(255, 255, 255, 0.18);
	border-radius: 16px;
	background: linear-gradient(135deg, #1e1e2f, #101018);
	color: #ffffff;
	font-size: 18px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.botao-liga:hover {
	transform: translateY(-3px);
	border-color: #d7ff38;
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35);
}

@media (max-width: 700px) {
	.grade-ligas {
		grid-template-columns: 1fr;
	}

	.botao-liga {
		font-size: 16px;
	}
}
.cabecalho-grupos-cup {
	caption-side: top;
	padding-bottom: 8px;
}

#tela-campeoes-ligas .card {
	margin-top: 20px;
	overflow-x: auto;
}

#tabela-campeoes-ligas td {
	font-size: 13px;
	vertical-align: middle;
}

#tabela-campeoes-ligas td:nth-child(1) {
	font-weight: 800;
	color: #ffd83d;
}

#tabela-campeoes-ligas td:nth-child(2) {
	font-weight: 800;
}

#botao-continuar-campeoes {
	margin-top: 20px;
	width: 100%;
	padding: 14px;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 800;
	cursor: pointer;
}

.cabecalho-temporada-global {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 12px;
	width: 100%;
}

#abas-ligas-temporada {
	order: 1;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 6px 0;
}

#abas-ligas-temporada .botao-liga-temporada {
	width: auto;
	min-width: 110px;
	height: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 14px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1;
}

#abas-ligas-temporada .botao-liga-temporada.ativa {
	transform: scale(1.04);
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
}

.titulo-temporada-global {
	order: 2;
	flex: 1 1 auto;
	display: flex;
	flex-direction: row;
	align-items: baseline;
	justify-content: flex-start;
	gap: 8px;
	min-width: 260px;
}

.titulo-temporada-global #jogo-titulo {
	order: 1;
	font-size: 30px;
	line-height: 1;
	margin: 0;
}

.titulo-temporada-global #jogo-rodada-label {
	order: 2;
	font-size: 14px;
	line-height: 1;
	margin: 0;
}

#botao-proxima-rodada {
	order: 3;
	margin-left: auto;
}

#botao-sair-jogo {
	order: 4;
}

#tela-jogo .jogo-topo.cabecalho-temporada-global {
	display: grid;
	grid-template-columns: 1fr auto auto;
	grid-template-areas:
		"titulo titulo titulo"
		"titulo proxima sair";
	align-items: end;
	gap: 10px 10px;
}

#tela-jogo .titulo-temporada-global {
	grid-area: titulo;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 8px;
	min-width: 0;
}

#tela-jogo #abas-ligas-temporada {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 8px 0;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada {
	width: auto;
	min-width: 110px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 8px 12px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada.ativa {
	transform: none;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
}

#tela-jogo .titulo-temporada-global #jogo-titulo {
	order: 2;
	margin: 0;
	font-size: 30px;
	line-height: 1;
}

#tela-jogo .titulo-temporada-global #jogo-rodada-label {
	order: 3;
	margin: -30px 0 0 160px;
	color: #facc15;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
}

#tela-jogo #botao-proxima-rodada {
	grid-area: proxima;
	margin: 0;
	align-self: end;
}

#tela-jogo #botao-sair-jogo {
	grid-area: sair;
	margin: 0;
	align-self: end;
}

#tela-jogo .jogo-topo.cabecalho-temporada-global {
	display: block;
}

#tela-jogo .titulo-temporada-global {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	width: 100%;
}

#tela-jogo #abas-ligas-temporada {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: nowrap;
	gap: 8px;
	margin: 0 0 14px 0;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada,
#tela-jogo #abas-ligas-temporada .botao-acao-temporada-topo {
	width: auto;
	min-width: 110px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 8px 12px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1;
}

#tela-jogo #abas-ligas-temporada .botao-acao-temporada-topo {
	min-width: 130px;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada.ativa {
	transform: none;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
}

#tela-jogo #abas-ligas-temporada .espaco-botoes-temporada {
	flex: 1;
	min-width: 20px;
}

#tela-jogo .titulo-temporada-global #jogo-titulo {
	order: 2;
	margin: 0;
	font-size: 30px;
	line-height: 1;
	text-align: left;
}

#tela-jogo .titulo-temporada-global #jogo-rodada-label {
	order: 3;
	margin: -24px 0 0 160px;
	color: #facc15;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
	text-align: left;
}

.resultado-rodada-item {
	cursor: pointer;
}

.resultado-rodada-item:hover {
	border-color: #facc15;
	background: #1f2937;
}

.resultado-rodada-item.resultado-selecionado {
	outline: 1px solid #facc15;
	background: #1f2937;
	box-shadow: inset 3px 0 0 #facc15;
	color: #ffffff;
}

.resultado-rodada-item.resultado-selecionado strong {
	color: #fde047;
}

/* ========================= */
/* AJUSTE GLOBAL SEGURO - CENTRALIZADO + TELAS GRANDES NO TOPO */
/* ========================= */

html,
body {
	min-height: 100%;
}

body {
	overflow-x: hidden;
	overflow-y: auto;
}

#app {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	overflow-x: hidden;
}

/* Telas grandes ficam no topo, mas sem mudar altura/formato interno */
#tela-draft.ativa,
#tela-elencos.ativa,
#tela-jogo.ativa,
#tela-mundial.ativa,
#tela-sorteio-mundial.ativa,
#tela-chaveamento-mundial.ativa {
	align-self: flex-start;
	margin-top: 0;
}

/* Telas menores continuam centralizadas */
#tela-inicial.ativa,
#tela-selecao-liga.ativa,
#tela-resultado.ativa,
#tela-campeoes.ativa {
	align-self: center;
}

/* Se a janela estiver baixa, reduz só o respiro externo */
@media (max-height: 760px) {
	#app {
		align-items: flex-start;
		padding: 8px 20px 16px;
	}

	#tela-inicial.ativa,
	#tela-selecao-liga.ativa,
	#tela-resultado.ativa,
	#tela-campeoes.ativa {
		align-self: flex-start;
	}
}

/* ========================= */
/* CORREÇÃO FINAL - TELA CLASSIFICADOS MUNDIAL */
/* ========================= */

#tela-mundial {
	width: 1200px !important;
	max-width: calc(100vw - 24px) !important;
	height: calc(100vh - 24px) !important;
	max-height: 720px !important;
	padding: 16px !important;
	background:
		radial-gradient(circle at top left, rgba(250, 204, 21, 0.16), transparent 34%),
		radial-gradient(circle at bottom right, rgba(34, 197, 94, 0.10), transparent 36%),
		linear-gradient(145deg, #020617 0%, #111827 54%, #1f2937 100%) !important;
	border: 2px solid rgba(250, 204, 21, 0.42) !important;
	border-radius: 18px !important;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.62),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
	text-align: left !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

#tela-mundial.ativa {
	display: flex !important;
	flex-direction: column !important;
}

.mundial-topo {
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px !important;
	padding: 14px 18px !important;
	background: rgba(15, 23, 42, 0.94) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	text-align: left !important;
}

.mundial-topo p {
	margin: 0 0 5px 0 !important;
	color: #facc15 !important;
	font-size: 13px !important;
	font-weight: 950 !important;
	letter-spacing: 0.7px !important;
	line-height: 1 !important;
	text-transform: uppercase !important;
}

.mundial-topo h2 {
	margin: 0 !important;
	color: #ffffff !important;
	font-size: 32px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: left !important;
}

#botao-iniciar-mundial {
	width: 210px !important;
	height: 48px !important;
	margin: 0 !important;
	padding: 0 18px !important;
	border-radius: 10px !important;
	font-size: 17px !important;
	font-weight: 950 !important;
	line-height: 48px !important;
	box-shadow: 0 6px 0 #b45309 !important;
}

#tela-mundial > p {
	flex: 0 0 auto !important;
	margin: 10px 0 !important;
	padding: 9px 12px !important;
	background: rgba(15, 23, 42, 0.78) !important;
	border: 1px solid rgba(250, 204, 21, 0.28) !important;
	border-radius: 10px !important;
	color: #e5e7eb !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	box-sizing: border-box !important;
}

.mundial-layout {
	flex: 1 !important;
	min-height: 0 !important;
	display: grid !important;
	grid-template-columns: 390px minmax(0, 1fr) !important;
	gap: 14px !important;
	overflow: hidden !important;
}

.mundial-card,
.mundial-ranking-card {
	min-height: 0 !important;
	padding: 12px !important;
	background: rgba(15, 23, 42, 0.94) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
}

.mundial-card h3,
.mundial-ranking-card h3 {
	flex: 0 0 auto !important;
	margin: 0 0 10px 0 !important;
	padding-bottom: 8px !important;
	border-bottom: 1px solid #374151 !important;
	color: #facc15 !important;
	font-size: 19px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
}

.lista-classificados-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	counter-reset: classificados-mundial !important;
}

.lista-classificados-mundial li {
	counter-increment: classificados-mundial !important;
	position: relative !important;
	min-height: 34px !important;
	padding: 8px 10px 8px 38px !important;
	background: #111827 !important;
	border: 1px solid #374151 !important;
	border-radius: 10px !important;
	color: #e5e7eb !important;
	font-size: 12px !important;
	font-weight: 850 !important;
	line-height: 1.15 !important;
	text-align: left !important;
	box-sizing: border-box !important;
}

.lista-classificados-mundial li::before {
	content: counter(classificados-mundial) "." !important;
	position: absolute !important;
	left: 10px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	color: #facc15 !important;
	font-size: 12px !important;
	font-weight: 950 !important;
}

.lista-classificados-mundial li.classificado-ranking {
	border-color: #facc15 !important;
	background: rgba(250, 204, 21, 0.12) !important;
	box-shadow: inset 4px 0 0 #facc15 !important;
	color: #ffffff !important;
}

.legenda-ranking-mundial {
	flex: 0 0 auto !important;
	margin: 0 0 8px 0 !important;
	color: #cbd5e1 !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	text-align: center !important;
}

.mundial-ranking-card table {
	flex: 1 !important;
	min-height: 0 !important;
	margin-top: 0 !important;
	background: #111827 !important;
	font-size: 13px !important;
}

.mundial-ranking-card th,
.mundial-ranking-card td {
	padding: 7px 6px !important;
	text-align: center !important;
}

.mundial-ranking-card th {
	color: #facc15 !important;
	background: #374151 !important;
}

.mundial-ranking-card tbody {
	background: #111827 !important;
}

.mundial-ranking-card tr.classificado-ranking {
	background: rgba(250, 204, 21, 0.14) !important;
	outline: 2px solid rgba(250, 204, 21, 0.65) !important;
	outline-offset: -2px !important;
}

.mundial-ranking-card tr.classificado-ranking td {
	color: #ffffff !important;
	font-weight: 950 !important;
}

@media (max-width: 1000px) {
	#tela-mundial {
		height: auto !important;
		max-height: none !important;
		overflow: visible !important;
	}

	#tela-mundial.ativa {
		display: block !important;
	}

	.mundial-topo {
		flex-direction: column !important;
		text-align: center !important;
	}

	.mundial-topo h2 {
		text-align: center !important;
	}

	#botao-iniciar-mundial {
		width: 100% !important;
	}

	.mundial-layout {
		display: flex !important;
		flex-direction: column !important;
		overflow: visible !important;
	}

	.mundial-card,
	.mundial-ranking-card {
		min-height: 260px !important;
	}

	.lista-classificados-mundial {
		max-height: 360px !important;
	}
}

/* ========================= */
/* CORREÇÃO FINAL - SORTEIO DO MUNDIAL */
/* ========================= */

#tela-sorteio-mundial {
	width: 1200px !important;
	max-width: calc(100vw - 24px) !important;
	height: calc(100vh - 24px) !important;
	max-height: none !important;
	padding: 16px !important;
	background:
		radial-gradient(circle at top left, rgba(250, 204, 21, 0.16), transparent 34%),
		radial-gradient(circle at bottom right, rgba(239, 68, 68, 0.12), transparent 36%),
		linear-gradient(145deg, #020617 0%, #111827 54%, #1f2937 100%) !important;
	border: 2px solid rgba(250, 204, 21, 0.42) !important;
	border-radius: 18px !important;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.62),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
	text-align: left !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

#tela-sorteio-mundial.ativa {
	display: flex !important;
	flex-direction: column !important;
	align-self: flex-start !important;
	margin-top: 0 !important;
}

.sorteio-mundial-topo {
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px !important;
	padding: 14px 18px !important;
	background: rgba(15, 23, 42, 0.94) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	text-align: left !important;
}

.sorteio-mundial-topo p {
	margin: 0 0 5px 0 !important;
	color: #facc15 !important;
	font-size: 13px !important;
	font-weight: 950 !important;
	letter-spacing: 0.7px !important;
	line-height: 1 !important;
	text-transform: uppercase !important;
}

.sorteio-mundial-topo h2 {
	margin: 0 !important;
	color: #ffffff !important;
	font-size: 32px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: left !important;
}

.botoes-sorteio-mundial {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
}

#botao-sortear-time-mundial,
#botao-ver-chaveamento-mundial {
	width: 190px !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border-radius: 10px !important;
	font-size: 16px !important;
	font-weight: 950 !important;
	line-height: 44px !important;
	box-shadow: 0 6px 0 #b45309 !important;
}

#botao-ver-chaveamento-mundial {
	background: #22c55e !important;
	color: #052e16 !important;
	box-shadow: 0 6px 0 #166534 !important;
}

.descricao-sorteio-mundial {
	flex: 0 0 auto !important;
	margin: 10px 0 12px 0 !important;
	padding: 10px 14px !important;
	background: rgba(15, 23, 42, 0.72) !important;
	border: 1px solid rgba(250, 204, 21, 0.22) !important;
	border-radius: 12px !important;
	color: #e5e7eb !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	text-align: center !important;
	box-sizing: border-box !important;
}

.sorteio-mundial-layout {
	flex: 1 !important;
	min-height: 0 !important;
	display: grid !important;
	grid-template-columns: 330px minmax(0, 1fr) !important;
	gap: 14px !important;
	overflow: hidden !important;
}

.sorteio-mundial-card {
	min-height: 0 !important;
	padding: 12px !important;
	background: rgba(15, 23, 42, 0.88) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	display: flex !important;
	flex-direction: column !important;
}

.sorteio-mundial-card h3 {
	flex: 0 0 auto !important;
	margin: 0 0 10px 0 !important;
	padding-bottom: 8px !important;
	border-bottom: 1px solid #374151 !important;
	color: #facc15 !important;
	font-size: 19px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.time-sorteado-mundial {
	flex: 0 0 auto !important;
	min-height: 150px !important;
	padding: 16px !important;
	background:
		radial-gradient(circle at top, rgba(250, 204, 21, 0.20), transparent 58%),
		#020617 !important;
	border: 2px solid rgba(250, 204, 21, 0.45) !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}

.contador-sorteio-mundial {
	flex: 0 0 auto !important;
	margin: 10px 0 !important;
	padding: 8px 10px !important;
	background: #111827 !important;
	border: 1px solid #374151 !important;
	border-radius: 10px !important;
	color: #facc15 !important;
	font-size: 16px !important;
	font-weight: 950 !important;
	text-align: center !important;
	box-sizing: border-box !important;
}

.lista-pendentes-sorteio-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
}

.item-pendente-sorteio-mundial {
	padding: 7px 9px !important;
	background: #111827 !important;
	border: 1px solid #374151 !important;
	border-radius: 8px !important;
	color: #e5e7eb !important;
	font-size: 12px !important;
	font-weight: 850 !important;
	line-height: 1.1 !important;
	text-align: left !important;
	box-sizing: border-box !important;
}

.grade-sorteio-rodada-1 {
	flex: 1 !important;
	min-height: 0 !important;
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 10px !important;
	overflow-y: auto !important;
	padding-right: 6px !important;
	box-sizing: border-box !important;
}

.jogo-sorteio-mundial {
	min-height: 116px !important;
	padding: 9px !important;
	background: #111827 !important;
	border: 1px dashed #4b5563 !important;
	border-radius: 12px !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
}

.jogo-sorteio-mundial h4 {
	margin: 0 0 7px 0 !important;
	padding: 5px 8px !important;
	background: rgba(250, 204, 21, 0.12) !important;
	border: 1px solid rgba(250, 204, 21, 0.32) !important;
	border-radius: 8px !important;
	color: #facc15 !important;
	font-size: 12px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.vaga-sorteio-mundial {
	margin-bottom: 6px !important;
	padding: 8px 10px !important;
	background: #020617 !important;
	border: 1px solid #374151 !important;
	border-radius: 8px !important;
	color: #94a3b8 !important;
	font-size: 12px !important;
	font-weight: 850 !important;
	line-height: 1.1 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	box-sizing: border-box !important;
}

.vaga-sorteio-mundial.preenchida {
	border-color: rgba(250, 204, 21, 0.45) !important;
	color: #ffffff !important;
	background: rgba(2, 6, 23, 0.92) !important;
}

/* ========================= */
/* CORREÇÃO FINAL - CHAVEAMENTO DO MUNDIAL */
/* ========================= */

#tela-chaveamento-mundial {
	width: 1320px !important;
	max-width: calc(100vw - 24px) !important;
	height: calc(100vh - 24px) !important;
	max-height: none !important;
	padding: 16px !important;
	background:
		radial-gradient(circle at top left, rgba(250, 204, 21, 0.15), transparent 32%),
		radial-gradient(circle at bottom right, rgba(34, 197, 94, 0.10), transparent 38%),
		linear-gradient(145deg, #020617 0%, #111827 52%, #1f2937 100%) !important;
	border: 2px solid rgba(250, 204, 21, 0.42) !important;
	border-radius: 18px !important;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.62),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04) !important;
	text-align: left !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

#tela-chaveamento-mundial.ativa {
	display: flex !important;
	flex-direction: column !important;
	align-self: flex-start !important;
	margin-top: 0 !important;
}

.chaveamento-mundial-topo {
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px !important;
	padding: 12px 16px !important;
	background: rgba(15, 23, 42, 0.92) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	text-align: left !important;
}

.chaveamento-mundial-topo p {
	margin: 0 0 5px 0 !important;
	color: #facc15 !important;
	font-size: 12px !important;
	font-weight: 950 !important;
	letter-spacing: 0.7px !important;
	line-height: 1 !important;
	text-transform: uppercase !important;
}

.chaveamento-mundial-topo h2 {
	margin: 0 !important;
	color: #ffffff !important;
	font-size: 30px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: left !important;
}

#botao-jogar-mundial {
	width: 210px !important;
	height: 42px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border-radius: 10px !important;
	font-size: 16px !important;
	font-weight: 950 !important;
	line-height: 42px !important;
	box-shadow: 0 6px 0 #b45309 !important;
}

.descricao-chaveamento-mundial {
	flex: 0 0 auto !important;
	margin: 8px 0 10px 0 !important;
	padding: 8px 12px !important;
	background: rgba(15, 23, 42, 0.72) !important;
	border: 1px solid rgba(250, 204, 21, 0.22) !important;
	border-radius: 12px !important;
	color: #e5e7eb !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	box-sizing: border-box !important;
}

.chaveamento-mundial-layout {
	flex: 1 !important;
	min-height: 0 !important;
	display: grid !important;
	grid-template-columns: 1.08fr 1.08fr 1fr 1fr 1fr 1fr !important;
	gap: 10px !important;
	overflow: hidden !important;
}

.coluna-chaveamento {
	min-width: 0 !important;
	min-height: 0 !important;
	padding: 10px !important;
	background: rgba(15, 23, 42, 0.86) !important;
	border: 2px solid #374151 !important;
	border-radius: 14px !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
}

.coluna-chaveamento h3 {
	flex: 0 0 auto !important;
	margin: 0 0 9px 0 !important;
	padding-bottom: 8px !important;
	border-bottom: 1px solid #374151 !important;
	color: #facc15 !important;
	font-size: 16px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.bloco-subchave {
	flex: 1 !important;
	min-height: 0 !important;
	margin-bottom: 10px !important;
	padding: 8px !important;
	background: rgba(2, 6, 23, 0.35) !important;
	border: 1px solid #374151 !important;
	border-radius: 12px !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
}

.bloco-subchave:last-child {
	margin-bottom: 0 !important;
}

.bloco-subchave h4 {
	flex: 0 0 auto !important;
	margin: 0 0 8px 0 !important;
	padding: 6px 8px !important;
	background: #facc15 !important;
	border-radius: 9px !important;
	color: #111827 !important;
	font-size: 12px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.lista-jogos-chaveamento {
	flex: 1 !important;
	min-height: 0 !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.jogo-chaveamento {
	padding: 8px !important;
	background: #111827 !important;
	border: 1px dashed #4b5563 !important;
	border-radius: 12px !important;
	box-sizing: border-box !important;
}

.jogo-chaveamento.ativo {
	border-style: solid !important;
	border-color: #facc15 !important;
	box-shadow: inset 0 0 0 1px rgba(250, 204, 21, 0.10) !important;
}

.jogo-chaveamento.finalizado {
	border-style: solid !important;
	border-color: #22c55e !important;
}

.jogo-chaveamento h4 {
	margin: 0 0 6px 0 !important;
	color: #facc15 !important;
	font-size: 11px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
}

.linha-time-chaveamento {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 8px !important;
	margin-bottom: 5px !important;
	padding: 7px 8px !important;
	background: #020617 !important;
	border: 1px solid #374151 !important;
	border-radius: 8px !important;
	box-sizing: border-box !important;
}

.linha-time-chaveamento:last-child {
	margin-bottom: 0 !important;
}

.nome-time-chaveamento {
	flex: 1 !important;
	min-width: 0 !important;
	color: #e5e7eb !important;
	font-size: 11px !important;
	font-weight: 850 !important;
	line-height: 1.1 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.placar-time-chaveamento {
	flex: 0 0 auto !important;
	min-width: 18px !important;
	color: #facc15 !important;
	font-size: 12px !important;
	font-weight: 950 !important;
	text-align: right !important;
}

.linha-time-chaveamento.vencedor {
	border-color: rgba(34, 197, 94, 0.65) !important;
	background: rgba(22, 101, 52, 0.28) !important;
}

.linha-time-chaveamento.perdedor {
	opacity: 0.65 !important;
}

.caixa-eliminados-mundial,
.trofeu-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	margin-top: 10px !important;
}

.lista-eliminados-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 5px !important;
}

/* ========================= */
/* RESPONSIVO - MUNDIAL */
/* ========================= */

@media (max-width: 1150px) {
	#tela-sorteio-mundial,
	#tela-chaveamento-mundial {
		height: auto !important;
		min-height: calc(100vh - 24px) !important;
		max-height: none !important;
		overflow: visible !important;
	}

	#tela-sorteio-mundial.ativa,
	#tela-chaveamento-mundial.ativa {
		display: block !important;
	}

	.sorteio-mundial-topo,
	.chaveamento-mundial-topo {
		flex-direction: column !important;
		text-align: center !important;
	}

	.sorteio-mundial-topo h2,
	.chaveamento-mundial-topo h2 {
		text-align: center !important;
	}

	.botoes-sorteio-mundial {
		width: 100% !important;
		justify-content: center !important;
	}

	.sorteio-mundial-layout {
		display: flex !important;
		flex-direction: column !important;
		overflow: visible !important;
	}

	.grade-sorteio-rodada-1 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		overflow: visible !important;
	}

	.chaveamento-mundial-layout {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		overflow: visible !important;
	}

	.coluna-chaveamento {
		min-height: 260px !important;
	}
}

@media (max-width: 700px) {
	.grade-sorteio-rodada-1,
	.chaveamento-mundial-layout {
		grid-template-columns: 1fr !important;
	}

	#botao-sortear-time-mundial,
	#botao-ver-chaveamento-mundial,
	#botao-jogar-mundial {
		width: 100% !important;
	}

	.botoes-sorteio-mundial {
		flex-direction: column !important;
	}
}

/* ========================= */
/* CHAVEAMENTO MUNDIAL - MODO COMPACTO */
/* ========================= */

#tela-chaveamento-mundial {
	padding: 10px !important;
}

.chaveamento-mundial-topo {
	padding: 8px 12px !important;
}

.chaveamento-mundial-topo p {
	margin: 0 0 3px 0 !important;
	font-size: 11px !important;
}

.chaveamento-mundial-topo h2 {
	font-size: 26px !important;
}

#botao-jogar-mundial {
	width: 190px !important;
	height: 38px !important;
	font-size: 15px !important;
	line-height: 38px !important;
}

.descricao-chaveamento-mundial {
	margin: 6px 0 8px 0 !important;
	padding: 6px 10px !important;
	font-size: 12px !important;
	line-height: 1.1 !important;
}

.chaveamento-mundial-layout {
	gap: 8px !important;
}

.coluna-chaveamento {
	padding: 8px !important;
}

.coluna-chaveamento h3 {
	margin: 0 0 6px 0 !important;
	padding-bottom: 6px !important;
	font-size: 15px !important;
}

.bloco-subchave {
	margin-bottom: 6px !important;
	padding: 6px !important;
}

.bloco-subchave h4 {
	margin: 0 0 5px 0 !important;
	padding: 4px 6px !important;
	border-radius: 7px !important;
	font-size: 10px !important;
	line-height: 1 !important;
}

.lista-jogos-chaveamento {
	gap: 6px !important;
}

.jogo-chaveamento {
	padding: 5px !important;
	border-radius: 9px !important;
}

.jogo-chaveamento h4 {
	margin: 0 0 4px 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	color: #facc15 !important;
	font-size: 10px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: left !important;
}

.linha-time-chaveamento {
	min-height: 26px !important;
	margin-bottom: 4px !important;
	padding: 5px 7px !important;
	border-radius: 7px !important;
	gap: 6px !important;
}

.nome-time-chaveamento {
	font-size: 10px !important;
	line-height: 1 !important;
}

.placar-time-chaveamento {
	min-width: 14px !important;
	font-size: 11px !important;
	line-height: 1 !important;
}

.caixa-eliminados-mundial,
.trofeu-mundial {
	margin-top: 6px !important;
}

.caixa-eliminados-mundial h4,
.trofeu-mundial h4 {
	margin: 0 0 6px 0 !important;
	font-size: 13px !important;
	line-height: 1 !important;
}

.item-eliminado-mundial {
	padding: 5px 7px !important;
	font-size: 10px !important;
	line-height: 1 !important;
}

/* A Rodada 1 precisa ser a mais compacta porque tem 8 jogos */
#mundial-rodada-1 .jogo-chaveamento {
	padding: 4px !important;
}

#mundial-rodada-1 .jogo-chaveamento h4 {
	margin-bottom: 3px !important;
	font-size: 9px !important;
}

#mundial-rodada-1 .linha-time-chaveamento {
	min-height: 24px !important;
	margin-bottom: 3px !important;
	padding: 4px 6px !important;
}

#mundial-rodada-1 .nome-time-chaveamento {
	font-size: 9px !important;
}

/* Rodada 2 e Last Chance também ficam mais apertadas */
#mundial-rodada-2-ganhadores .jogo-chaveamento,
#mundial-rodada-2-perdedores .jogo-chaveamento,
#mundial-last-chance .jogo-chaveamento,
#mundial-quartas .jogo-chaveamento {
	padding: 4px !important;
}

#mundial-rodada-2-ganhadores .jogo-chaveamento h4,
#mundial-rodada-2-perdedores .jogo-chaveamento h4,
#mundial-last-chance .jogo-chaveamento h4,
#mundial-quartas .jogo-chaveamento h4 {
	margin-bottom: 3px !important;
	font-size: 9px !important;
}

#mundial-rodada-2-ganhadores .linha-time-chaveamento,
#mundial-rodada-2-perdedores .linha-time-chaveamento,
#mundial-last-chance .linha-time-chaveamento,
#mundial-quartas .linha-time-chaveamento {
	min-height: 24px !important;
	margin-bottom: 3px !important;
	padding: 4px 6px !important;
}

#mundial-rodada-2-ganhadores .nome-time-chaveamento,
#mundial-rodada-2-perdedores .nome-time-chaveamento,
#mundial-last-chance .nome-time-chaveamento,
#mundial-quartas .nome-time-chaveamento {
	font-size: 9px !important;
}

/* ========================= */
/* CHAVEAMENTO - COMPACTAR TÍTULO DOS JOGOS */
/* ========================= */

#tela-chaveamento-mundial .jogo-chaveamento {
	min-height: auto !important;
	padding: 5px !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 3px !important;
}

/* Pega o título do jogo mesmo se ele estiver como h4, div, p ou outro elemento */
#tela-chaveamento-mundial .jogo-chaveamento > *:first-child {
	height: 14px !important;
	min-height: 14px !important;
	max-height: 14px !important;
	margin: 0 0 3px 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	color: #facc15 !important;
	font-size: 10px !important;
	font-weight: 950 !important;
	line-height: 14px !important;
	text-align: left !important;
	text-transform: uppercase !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	box-sizing: border-box !important;
}

/* Remove qualquer espaço antigo dos títulos específicos */
#tela-chaveamento-mundial .jogo-chaveamento h4,
#tela-chaveamento-mundial .jogo-chaveamento p,
#tela-chaveamento-mundial .jogo-chaveamento strong {
	margin-top: 0 !important;
	margin-bottom: 3px !important;
}

/* Linhas dos times mais grudadas no título */
#tela-chaveamento-mundial .linha-time-chaveamento {
	min-height: 23px !important;
	margin: 0 0 3px 0 !important;
	padding: 4px 6px !important;
}

/* Última linha sem margem sobrando */
#tela-chaveamento-mundial .linha-time-chaveamento:last-child {
	margin-bottom: 0 !important;
}

/* Texto dos times mais compacto */
#tela-chaveamento-mundial .nome-time-chaveamento {
	font-size: 9px !important;
	line-height: 1 !important;
}

#tela-chaveamento-mundial .placar-time-chaveamento {
	font-size: 10px !important;
	line-height: 1 !important;
}

/* Rodada 1 ainda mais compacta, porque tem 8 jogos */
#mundial-rodada-1 .jogo-chaveamento {
	padding: 4px !important;
	gap: 2px !important;
}

#mundial-rodada-1 .jogo-chaveamento > *:first-child {
	height: 12px !important;
	min-height: 12px !important;
	max-height: 12px !important;
	margin-bottom: 2px !important;
	font-size: 9px !important;
	line-height: 12px !important;
}

#mundial-rodada-1 .linha-time-chaveamento {
	min-height: 21px !important;
	margin-bottom: 2px !important;
	padding: 3px 6px !important;
}

/* ========================= */
/* CHAVEAMENTO - COMPACTAR AVISOS, ELIMINADOS E TROFÉU */
/* ========================= */

/* Troca "Sorteio após o Last Chance: 2-0 x 2-1" por só "Sorteio" */
#tela-chaveamento-mundial .aviso-sorteio-quartas {
	height: 18px !important;
	min-height: 18px !important;
	max-height: 18px !important;
	margin: 0 0 5px 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 18px !important;
	text-align: left !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}

#tela-chaveamento-mundial .aviso-sorteio-quartas::before {
	content: "Sorteio" !important;
	color: #facc15 !important;
	font-size: 10px !important;
	font-weight: 950 !important;
	line-height: 18px !important;
	text-transform: uppercase !important;
}

/* Eliminados mais compacto */
#tela-chaveamento-mundial .caixa-eliminados-mundial {
	flex: 0 0 auto !important;
	min-height: 42px !important;
	max-height: 90px !important;
	margin-top: 5px !important;
	padding: 5px !important;
	background: rgba(127, 29, 29, 0.12) !important;
	border: 1px solid rgba(248, 113, 113, 0.22) !important;
	border-radius: 8px !important;
	overflow: hidden !important;
}

#tela-chaveamento-mundial .caixa-eliminados-mundial h4 {
	height: 13px !important;
	margin: 0 0 3px 0 !important;
	padding: 0 !important;
	color: #fecaca !important;
	font-size: 10px !important;
	font-weight: 950 !important;
	line-height: 13px !important;
	text-align: left !important;
	text-transform: uppercase !important;
}

#tela-chaveamento-mundial .caixa-eliminados-mundial p {
	margin: 0 !important;
	color: #e5e7eb !important;
	font-size: 8px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	text-align: left !important;
}

#tela-chaveamento-mundial .lista-eliminados-mundial {
	gap: 3px !important;
	max-height: 56px !important;
	overflow-y: auto !important;
}

#tela-chaveamento-mundial .item-eliminado-mundial {
	padding: 3px 5px !important;
	border-radius: 6px !important;
	font-size: 8px !important;
	line-height: 1 !important;
}

/* Troféu/Campeão Mundial mais compacto */
#tela-chaveamento-mundial .trofeu-mundial {
	flex: 0 0 auto !important;
	min-height: 70px !important;
	max-height: 110px !important;
	margin-top: 5px !important;
	padding: 6px !important;
	background: rgba(2, 6, 23, 0.35) !important;
	border: 1px solid rgba(250, 204, 21, 0.25) !important;
	border-radius: 8px !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	text-align: left !important;
}

#tela-chaveamento-mundial .trofeu-mundial p {
	margin: 0 0 4px 0 !important;
	font-size: 18px !important;
	line-height: 1 !important;
	text-align: left !important;
}

#tela-chaveamento-mundial .trofeu-mundial strong {
	margin: 0 !important;
	color: #facc15 !important;
	font-size: 10px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: left !important;
	text-transform: uppercase !important;
}

#tela-chaveamento-mundial #campeao-mundial-texto {
	margin-top: 4px !important;
	color: #ffffff !important;
	font-size: 10px !important;
	font-weight: 900 !important;
	line-height: 1.1 !important;
	text-align: left !important;
}

/* ========================= */
/* CHAVEAMENTO - AVISOS BONITOS */
/* ========================= */

/* Sorteio das quartas bonito e com texto curto */
#tela-chaveamento-mundial .aviso-sorteio-quartas {
	height: auto !important;
	min-height: 38px !important;
	max-height: none !important;
	margin: 0 0 8px 0 !important;
	padding: 9px 10px !important;
	background:
		linear-gradient(135deg, rgba(250, 204, 21, 0.20), rgba(250, 204, 21, 0.06)),
		#020617 !important;
	border: 1px solid rgba(250, 204, 21, 0.55) !important;
	border-radius: 10px !important;
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.04),
		0 0 12px rgba(250, 204, 21, 0.10) !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 1 !important;
	text-align: center !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}

#tela-chaveamento-mundial .aviso-sorteio-quartas::before {
	content: "Sorteio" !important;
	display: block !important;
	color: #facc15 !important;
	font-size: 13px !important;
	font-weight: 950 !important;
	line-height: 18px !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
}

/* Caixa de eliminados bonita */
#tela-chaveamento-mundial .caixa-eliminados-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	max-height: none !important;
	margin-top: 8px !important;
	padding: 9px !important;
	background:
		linear-gradient(135deg, rgba(127, 29, 29, 0.30), rgba(15, 23, 42, 0.70)),
		#020617 !important;
	border: 1px solid rgba(248, 113, 113, 0.35) !important;
	border-radius: 12px !important;
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.04),
		0 0 14px rgba(127, 29, 29, 0.14) !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	overflow: hidden !important;
}

#tela-chaveamento-mundial .caixa-eliminados-mundial h4 {
	height: auto !important;
	margin: 0 0 8px 0 !important;
	padding: 6px 8px !important;
	background: rgba(248, 113, 113, 0.12) !important;
	border: 1px solid rgba(248, 113, 113, 0.24) !important;
	border-radius: 8px !important;
	color: #fecaca !important;
	font-size: 11px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
	box-sizing: border-box !important;
}

#tela-chaveamento-mundial .caixa-eliminados-mundial p {
	margin: 0 !important;
	padding: 8px !important;
	background: rgba(2, 6, 23, 0.52) !important;
	border: 1px dashed rgba(248, 113, 113, 0.20) !important;
	border-radius: 8px !important;
	color: #fecaca !important;
	font-size: 10px !important;
	font-weight: 850 !important;
	line-height: 1.15 !important;
	text-align: center !important;
	box-sizing: border-box !important;
}

#tela-chaveamento-mundial .lista-eliminados-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	max-height: none !important;
	overflow-y: auto !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 5px !important;
}

#tela-chaveamento-mundial .item-eliminado-mundial {
	padding: 6px 8px !important;
	background: rgba(2, 6, 23, 0.72) !important;
	border: 1px solid rgba(248, 113, 113, 0.28) !important;
	border-radius: 8px !important;
	color: #fecaca !important;
	font-size: 10px !important;
	font-weight: 850 !important;
	line-height: 1.1 !important;
}

/* Troféu bonito */
#tela-chaveamento-mundial .trofeu-mundial {
	flex: 1 !important;
	min-height: 0 !important;
	max-height: none !important;
	margin-top: 8px !important;
	padding: 14px 10px !important;
	background:
		radial-gradient(circle at top, rgba(250, 204, 21, 0.24), transparent 46%),
		linear-gradient(145deg, rgba(250, 204, 21, 0.10), rgba(15, 23, 42, 0.82)),
		#020617 !important;
	border: 1px solid rgba(250, 204, 21, 0.42) !important;
	border-radius: 12px !important;
	box-shadow:
		inset 0 0 0 1px rgba(255, 255, 255, 0.05),
		0 0 18px rgba(250, 204, 21, 0.12) !important;
	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}

#tela-chaveamento-mundial .trofeu-mundial p {
	margin: 0 0 10px 0 !important;
	font-size: 40px !important;
	line-height: 1 !important;
	text-align: center !important;
	filter: drop-shadow(0 0 10px rgba(250, 204, 21, 0.32)) !important;
}

#tela-chaveamento-mundial .trofeu-mundial strong {
	display: block !important;
	margin: 0 !important;
	padding: 7px 10px !important;
	background: rgba(250, 204, 21, 0.12) !important;
	border: 1px solid rgba(250, 204, 21, 0.30) !important;
	border-radius: 999px !important;
	color: #facc15 !important;
	font-size: 11px !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
}

#tela-chaveamento-mundial #campeao-mundial-texto {
	margin-top: 10px !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 950 !important;
	line-height: 1.15 !important;
	text-align: center !important;
}

/* ========================= */
/* TELA DE JOGO - AJUSTE LEVE SEM ESTICAR DEMAIS */
/* ========================= */

#tela-jogo {
	height: min(720px, calc(100vh - 44px)) !important;
	max-height: 720px !important;
	padding: 12px !important;
	overflow: hidden !important;
}

/* Mantém a tela um pouco mais para cima, mas sem colar no topo/fundo */
#tela-jogo.ativa {
	align-self: flex-start !important;
	margin-top: 10px !important;
	margin-bottom: 20px !important;
	display: flex !important;
	flex-direction: column !important;
}

/* Só reduz um pouco o cabeçalho para sobrar espaço */
#tela-jogo .jogo-topo {
	margin-bottom: 9px !important;
	padding: 9px 13px !important;
}

/* Mantém o layout original, só garante que nada corte seco */
#tela-jogo .jogo-layout {
	flex: 1 !important;
	min-height: 0 !important;
	height: auto !important;
	overflow: hidden !important;
}

/* A tabela pode rolar dentro do próprio card se faltar pouco espaço */
#tela-jogo .jogo-tabela-card {
	min-height: 0 !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
}

#tela-jogo .jogo-tabela-card table {
	margin: 0 !important;
}

#tela-jogo .jogo-tabela-card th,
#tela-jogo .jogo-tabela-card td {
	padding-top: 4px !important;
	padding-bottom: 4px !important;
	line-height: 1.05 !important;
}

/* Resultados não cortam seco */
#tela-jogo #resultados-rodada {
	overflow-y: auto !important;
	overflow-x: hidden !important;
}

/* Em tela baixa demais, aí sim libera a página para rolar */
@media (max-height: 700px) {
	#tela-jogo {
		height: auto !important;
		min-height: auto !important;
		max-height: none !important;
		overflow: visible !important;
	}

	#tela-jogo .jogo-layout {
		min-height: 560px !important;
	}
}

/* ========================= */
/* TELA RESUMO DA TEMPORADA */
/* ========================= */

#tela-resumo-temporada {
	width: 1180px;
	max-width: calc(100vw - 20px);
	height: calc(100vh - 20px);
	max-height: 680px;
	padding: 16px;
	background:
		radial-gradient(circle at top, rgba(250, 204, 21, 0.14), transparent 36%),
		linear-gradient(145deg, #111827 0%, #1f2937 58%, #111827 100%);
	border: 2px solid rgba(250, 204, 21, 0.35);
	border-radius: 18px;
	box-shadow:
		0 18px 45px rgba(0, 0, 0, 0.55),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
	box-sizing: border-box;
	text-align: left;
	overflow: hidden;
}

#tela-resumo-temporada.ativa {
	display: flex;
	flex-direction: column;
}

#tela-resumo-temporada .topo-tela {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 16px;
	margin-bottom: 10px;
	background: #0f172a;
	border: 2px solid #374151;
	border-radius: 14px;
	box-sizing: border-box;
}

#tela-resumo-temporada .topo-tela p {
	margin: 0 0 4px 0;
	color: #facc15;
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.6px;
	text-transform: uppercase;
}

#tela-resumo-temporada .topo-tela h2 {
	margin: 0;
	color: #ffffff;
	font-size: 30px;
	font-weight: 950;
	line-height: 1;
}

#tela-resumo-temporada .card {
	background: #0f172a;
	border: 2px solid #374151;
	border-radius: 14px;
	padding: 12px;
	box-sizing: border-box;
	overflow: hidden;
}

#tela-resumo-temporada .card h3 {
	margin: 0 0 10px 0;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
	color: #facc15;
	font-size: 18px;
	font-weight: 950;
	line-height: 1;
	text-align: center;
}

.resumo-mundial-card {
	flex: 0 0 auto;
	margin-bottom: 10px;
}

.resumo-mundial-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.resumo-destaque {
	min-height: 78px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px;
	background: #111827;
	border: 1px solid #374151;
	border-radius: 12px;
	box-sizing: border-box;
	text-align: center;
}

.resumo-destaque span {
	color: #d1d5db;
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.4px;
}

.resumo-destaque strong {
	color: #ffffff;
	font-size: 19px;
	font-weight: 950;
	line-height: 1.15;
}

#resumo-campeao-mundial {
	color: #facc15;
	font-size: 24px;
	text-shadow: 0 0 14px rgba(250, 204, 21, 0.25);
}

.resumo-top-artilheiros-card {
	flex: 0 0 auto;
	margin-bottom: 10px;
}

.resumo-top-5-artilheiros {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.resumo-top-5-artilheiros li {
	min-height: 66px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 8px;
	background: #111827;
	border: 1px solid #374151;
	border-radius: 10px;
	box-sizing: border-box;
	text-align: center;
}

.resumo-top-5-artilheiros li strong {
	color: #facc15;
	font-size: 17px;
	font-weight: 950;
	line-height: 1;
}

.resumo-top-5-artilheiros li span {
	width: 100%;
	color: #ffffff;
	font-size: 13px;
	font-weight: 900;
	line-height: 1.1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.resumo-top-5-artilheiros li small {
	color: #d1d5db;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
}

.resumo-ligas-card {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
}

.botoes-resumo-ligas {
	flex: 0 0 auto;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 8px;
	margin-bottom: 10px;
}

.botao-resumo-liga {
	width: 100%;
	height: 38px;
	margin: 0;
	padding: 0 8px;
	background: #111827;
	color: #e5e7eb;
	border: 1px solid #374151;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 950;
	line-height: 38px;
	box-sizing: border-box;
}

.botao-resumo-liga:hover {
	background: #1f2937;
	color: #ffffff;
	border-color: #facc15;
}

.botao-resumo-liga.ativo {
	background: #facc15;
	color: #111827;
	border-color: #facc15;
	box-shadow: 0 0 14px rgba(250, 204, 21, 0.22);
}

#tela-resumo-temporada .tabela-container {
	flex: 1;
	min-height: 0;
	overflow: hidden;
	background: #111827;
	border: 1px solid #374151;
	border-radius: 12px;
	box-sizing: border-box;
}

#tela-resumo-temporada table {
	margin: 0;
	width: 100%;
	height: 100%;
	background: #111827;
	font-size: 14px;
}

#tela-resumo-temporada th,
#tela-resumo-temporada td {
	padding: 9px 8px;
	border: 1px solid #374151;
	text-align: center;
}

#tela-resumo-temporada th {
	background: #1f2937;
	color: #facc15;
	font-size: 13px;
	font-weight: 950;
}

#tela-resumo-temporada td {
	color: #e5e7eb;
	font-size: 13px;
	font-weight: 800;
}

#tela-resumo-temporada td strong {
	color: #ffffff;
	font-weight: 950;
}

.acoes-centro {
	flex: 0 0 auto;
	display: flex;
	justify-content: center;
	margin-top: 10px;
}

.acoes-centro button {
	width: 220px;
	height: 42px;
	margin: 0;
	padding: 0 16px;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 950;
	line-height: 42px;
}

@media (max-width: 1000px) {
	#tela-resumo-temporada {
		height: auto;
		max-height: none;
		overflow: visible;
	}

	#tela-resumo-temporada.ativa {
		display: block;
	}

	.resumo-mundial-grid,
	.resumo-top-5-artilheiros,
	.botoes-resumo-ligas {
		grid-template-columns: 1fr;
	}

	.resumo-ligas-card {
		min-height: 280px;
	}

	#tela-resumo-temporada .tabela-container {
		overflow-x: auto;
	}
}

/* ========================= */
/* AJUSTE TOPO - RESUMO DA TEMPORADA */
/* ========================= */

#app:has(#tela-resumo-temporada.ativa) {
	align-items: flex-start;
	padding-top: 10px;
	padding-bottom: 10px;
}

#tela-resumo-temporada {
	height: calc(100vh - 20px) !important;
	max-height: calc(100vh - 20px) !important;
}

#tela-resumo-temporada .topo-tela {
	min-height: 58px;
	padding: 8px 14px;
	margin-bottom: 8px;
}

#tela-resumo-temporada .topo-tela h2 {
	font-size: 26px;
}

#tela-resumo-temporada .topo-tela p {
	font-size: 11px;
}

/* ========================= */
/* AJUSTE NATURAL - RESUMO SEM PRENDER EMBAIXO */
/* ========================= */

#app:has(#tela-resumo-temporada.ativa) {
	align-items: flex-start;
	padding-top: 10px;
	padding-bottom: 20px;
}

#tela-resumo-temporada {
	height: auto !important;
	min-height: auto !important;
	max-height: calc(100vh - 30px) !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
}

#tela-resumo-temporada.ativa {
	display: block !important;
}

#tela-resumo-temporada .resumo-ligas-card {
	display: block !important;
}

#tela-resumo-temporada .tabela-container {
	height: auto !important;
	min-height: auto !important;
	max-height: none !important;
	overflow: visible !important;
}

#tela-resumo-temporada table {
	height: auto !important;
}

/* ========================= */
/* REMOVER ÍCONES NO JOGO DO MUNDIAL */
/* ========================= */

#tela-jogo.modo-mundial #jogo-rodada-label::before {
	content: "" !important;
}

#tela-jogo.modo-mundial.modo-final #jogo-rodada-label::before {
	content: "" !important;
}

/* ========================= */
/* DESTAQUE DO TIME DO USUÁRIO NO MUNDIAL */
/* ========================= */

#tela-sorteio-mundial .vaga-sorteio-mundial.time-usuario-mundial,
#tela-chaveamento-mundial .linha-time-chaveamento.time-usuario-mundial {
	background: linear-gradient(90deg, rgba(250, 204, 21, 0.20), rgba(2, 6, 23, 0.95)) !important;
	border: 2px solid #facc15 !important;
	color: #ffffff !important;
	box-shadow:
		0 0 0 1px rgba(250, 204, 21, 0.20),
		0 0 12px rgba(250, 204, 21, 0.28) !important;
}

#tela-sorteio-mundial .vaga-sorteio-mundial.time-usuario-mundial::before,
#tela-chaveamento-mundial .linha-time-chaveamento.time-usuario-mundial::before {
	content: "";
	display: inline-block;
	width: 6px;
	min-width: 6px;
	height: 6px;
	margin-right: 6px;
	background: #facc15;
	border-radius: 999px;
	box-shadow: 0 0 8px rgba(250, 204, 21, 0.80);
}

#tela-chaveamento-mundial .linha-time-chaveamento.time-usuario-mundial .nome-time-chaveamento,
#tela-chaveamento-mundial .linha-time-chaveamento.time-usuario-mundial .placar-time-chaveamento {
	color: #ffffff !important;
	font-weight: 950 !important;
}

#tela-sorteio-mundial .vaga-sorteio-mundial.time-usuario-mundial {
	font-weight: 950 !important;
}

/* ========================= */
/* VELOCIDADE NO TOPO DA TEMPORADA */
/* ========================= */

#tela-jogo #abas-ligas-temporada .controle-velocidade-jogo {
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 0;
	padding: 0 10px;
	background: #0f172a;
	border: 1px solid #374151;
	border-radius: 12px;
	box-sizing: border-box;
}

#tela-jogo #abas-ligas-temporada .controle-velocidade-jogo label {
	width: auto;
	margin: 0;
	color: #facc15;
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;
}

#tela-jogo #abas-ligas-temporada .controle-velocidade-jogo select {
	width: 92px;
	height: 26px;
	margin: 0;
	padding: 2px 6px;
	background: #111827;
	border: 1px solid #4b5563;
	border-radius: 8px;
	color: #ffffff;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	text-align: center;
	box-sizing: border-box;
}

#tela-jogo #abas-ligas-temporada .controle-velocidade-jogo select:focus {
	border-color: #facc15;
	outline: none;
}

/* ========================= */
/* AJUSTE TOPO TEMPORADA - LIGAS MENORES + SAIR ANTES */
/* ========================= */

#tela-jogo #abas-ligas-temporada {
	gap: 6px !important;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada {
	min-width: 92px !important;
	height: 34px !important;
	padding: 7px 9px !important;
	border-radius: 11px !important;
	font-size: 13px !important;
	line-height: 1 !important;
}

#tela-jogo #abas-ligas-temporada .botao-liga-temporada.ativa {
	min-width: 104px !important;
}

#tela-jogo #abas-ligas-temporada .espaco-botoes-temporada {
	flex: 1 !important;
	min-width: 10px !important;
}

#tela-jogo #abas-ligas-temporada #botao-sair-jogo {
	order: 20 !important;
	min-width: 92px !important;
	height: 34px !important;
	padding: 7px 12px !important;
	font-size: 13px !important;
}

#tela-jogo #abas-ligas-temporada #botao-proxima-rodada {
	order: 21 !important;
	min-width: 126px !important;
	height: 34px !important;
	padding: 7px 12px !important;
	font-size: 13px !important;
}

#tela-jogo #abas-ligas-temporada .controle-velocidade-jogo {
	height: 34px !important;
}

/* ========================= */
/* AJUSTE PLACAR COM SHOOTOUT NO FEED */
/* ========================= */

#tela-jogo .placar-feed .placar-principal strong {
	min-width: 120px !important;
	font-size: 20px !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	text-align: center !important;
}

#tela-jogo .placar-feed .placar-principal {
	gap: 8px !important;
}

/* ========================= */
/* CAMPINHO 11x11 - DRAFT DO BRASILEIRÃO */
/* ========================= */

#tela-draft .campo-formacao,
#tela-elencos .campo-elenco {
	display: flex !important;
	flex-direction: column !important;
	justify-content: space-between !important;
	gap: 4px !important;
	position: relative !important;
	overflow: hidden !important;
	background:
		linear-gradient(
			to bottom,
			#1f3554 0%,
			#1f3554 12.5%,
			#2b466d 12.5%,
			#2b466d 25%,
			#1f3554 25%,
			#1f3554 37.5%,
			#2b466d 37.5%,
			#2b466d 50%,
			#1f3554 50%,
			#1f3554 62.5%,
			#2b466d 62.5%,
			#2b466d 75%,
			#1f3554 75%,
			#1f3554 87.5%,
			#2b466d 87.5%,
			#2b466d 100%
		) !important;
}

#tela-draft .campo-formacao {
	width: 460px !important;
	max-width: 460px !important;
	height: 542px !important;
	min-height: 542px !important;
	padding: 16px 14px !important;
	box-sizing: border-box !important;
}

#tela-elencos .campo-elenco {
	width: 390px !important;
	max-width: 390px !important;
	height: 455px !important;
	min-height: 455px !important;
	padding: 12px 10px !important;
	box-sizing: border-box !important;
}

#tela-draft .linha-campo-11,
#tela-elencos .linha-campo-11 {
	width: 100% !important;
	flex: 1 1 0 !important;
	min-height: 0 !important;
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
	align-items: center !important;
	justify-items: center !important;
	gap: 4px !important;
	position: relative !important;
	z-index: 2 !important;
}

#tela-draft .slot-campo-11,
#tela-elencos .slot-campo-11 {
	width: 100% !important;
	height: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	z-index: 2 !important;
}

#tela-draft .posicao-campo {
	width: 72px !important;
	min-width: 72px !important;
	max-width: 72px !important;
	height: 52px !important;
	min-height: 52px !important;
	max-height: 52px !important;
	margin: 0 !important;
	padding: 4px 5px !important;
	border-radius: 12px !important;
	font-size: 10px !important;
	line-height: 1.05 !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

#tela-draft .posicao-campo span {
	margin: 0 0 2px 0 !important;
	font-size: 10px !important;
	line-height: 1 !important;
}

#tela-draft .posicao-campo.ocupada {
	font-size: 9px !important;
	line-height: 1.05 !important;
	word-break: break-word !important;
}

#tela-draft .posicao-campo.destacada {
	transform: scale(1.04) !important;
	z-index: 5 !important;
}

#tela-elencos .jogador-campo-elenco {
	width: 68px !important;
	min-width: 68px !important;
	max-width: 68px !important;
	height: 46px !important;
	min-height: 46px !important;
	max-height: 46px !important;
	margin: 0 !important;
	padding: 3px 4px !important;
	border-radius: 9px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

#tela-elencos .jogador-campo-elenco strong {
	margin: 0 0 2px 0 !important;
	font-size: 13px !important;
	line-height: 1 !important;
}

#tela-elencos .jogador-campo-elenco span {
	margin: 0 0 2px 0 !important;
	font-size: 7px !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

#tela-elencos .jogador-campo-elenco small,
#tela-elencos .texto-raridade-elenco {
	display: block !important;
	font-size: 6px !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

#tela-elencos .jogador-campo-vazio {
	opacity: 0.35 !important;
	border-style: dashed !important;
}

#tela-draft .campo-formacao::before,
#tela-elencos .campo-elenco::before {
	content: "" !important;
	position: absolute !important;
	left: 0 !important;
	top: 50% !important;
	width: 100% !important;
	height: 3px !important;
	background: rgba(255, 255, 255, 0.6) !important;
	transform: translateY(-50%) !important;
	z-index: 1 !important;
}

#tela-draft .campo-formacao::after,
#tela-elencos .campo-elenco::after {
	content: "" !important;
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	width: 94px !important;
	height: 94px !important;
	border: 3px solid rgba(255, 255, 255, 0.6) !important;
	border-radius: 50% !important;
	transform: translate(-50%, -50%) !important;
	z-index: 1 !important;
}

#tela-draft .area-campo-topo,
#tela-draft .area-campo-baixo,
#tela-elencos .area-campo-topo,
#tela-elencos .area-campo-baixo {
	width: 150px !important;
	height: 58px !important;
	z-index: 1 !important;
}

#tela-draft .trave-campo-topo,
#tela-draft .trave-campo-baixo,
#tela-elencos .trave-campo-topo,
#tela-elencos .trave-campo-baixo {
	width: 82px !important;
	height: 10px !important;
	z-index: 1 !important;
}

/* ========================= */
/* AJUSTE TELA DE ELENCOS 11x11 */
/* ========================= */

#tela-elencos .visual-elenco {
	overflow: hidden !important;
}

#tela-elencos #nome-time-elenco {
	margin-bottom: 3px !important;
	font-size: 24px !important;
}

#tela-elencos .formacao-time-elenco {
	margin-bottom: 3px !important;
	font-size: 13px !important;
}

#tela-elencos .overall-time-elenco {
	margin: 0 0 7px 0 !important;
	font-size: 13px !important;
}

#tela-elencos .campo-elenco {
	margin-top: 0 !important;
}

/* ========================= */
/* AJUSTE DRAFT 11 JOGADORES */
/* ========================= */

#tela-draft #lista-elenco {
	height: 62px !important;
	min-height: 62px !important;
	max-height: 62px !important;
}

#tela-draft #lista-elenco li {
	padding: 5px 8px !important;
	font-size: 11px !important;
	line-height: 1 !important;
}

@media (max-width: 1050px) {
	#tela-draft .campo-formacao {
		width: 100% !important;
		max-width: 460px !important;
	}

	#tela-elencos .campo-elenco {
		width: 100% !important;
		max-width: 390px !important;
	}
}

#conteudo-escalacoes {
	max-height: 245px;
	overflow-y: auto;
	padding-right: 6px;
}

#escala-lista-a,
#escala-lista-b {
	padding-right: 4px;
}

#conteudo-escalacoes::-webkit-scrollbar {
	width: 8px;
}

#conteudo-escalacoes::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.35);
	border-radius: 999px;
}

#conteudo-escalacoes::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0.18);
	border-radius: 999px;
}

#conteudo-escalacoes,
#feed-jogo,
#resultados-rodada,
#tabela-ao-vivo,
#top-artilheiros,
.tabela-scroll,
.resultados-scroll,
.artilheiros-scroll {
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.35) rgba(0, 0, 0, 0.18);
}

#conteudo-escalacoes::-webkit-scrollbar,
#feed-jogo::-webkit-scrollbar,
#resultados-rodada::-webkit-scrollbar,
#tabela-ao-vivo::-webkit-scrollbar,
#top-artilheiros::-webkit-scrollbar,
.tabela-scroll::-webkit-scrollbar,
.resultados-scroll::-webkit-scrollbar,
.artilheiros-scroll::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

#conteudo-escalacoes::-webkit-scrollbar-thumb,
#feed-jogo::-webkit-scrollbar-thumb,
#resultados-rodada::-webkit-scrollbar-thumb,
#tabela-ao-vivo::-webkit-scrollbar-thumb,
#top-artilheiros::-webkit-scrollbar-thumb,
.tabela-scroll::-webkit-scrollbar-thumb,
.resultados-scroll::-webkit-scrollbar-thumb,
.artilheiros-scroll::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.35);
	border-radius: 999px;
	border: 2px solid rgba(15, 23, 42, 0.95);
}

#conteudo-escalacoes::-webkit-scrollbar-track,
#feed-jogo::-webkit-scrollbar-track,
#resultados-rodada::-webkit-scrollbar-track,
#tabela-ao-vivo::-webkit-scrollbar-track,
#top-artilheiros::-webkit-scrollbar-track,
.tabela-scroll::-webkit-scrollbar-track,
.resultados-scroll::-webkit-scrollbar-track,
.artilheiros-scroll::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0.18);
	border-radius: 999px;
}

#conteudo-escalacoes::-webkit-scrollbar-thumb:hover,
#feed-jogo::-webkit-scrollbar-thumb:hover,
#resultados-rodada::-webkit-scrollbar-thumb:hover,
#tabela-ao-vivo::-webkit-scrollbar-thumb:hover,
#top-artilheiros::-webkit-scrollbar-thumb:hover,
.tabela-scroll::-webkit-scrollbar-thumb:hover,
.resultados-scroll::-webkit-scrollbar-thumb:hover,
.artilheiros-scroll::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.55);
}

div:has(#tabela-ao-vivo),
section:has(#tabela-ao-vivo),
.card:has(#tabela-ao-vivo),
.painel:has(#tabela-ao-vivo),
.tabela-container,
.tabela-wrapper,
.tabela-scroll,
.card-tabela,
.painel-tabela {
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.35) rgba(0, 0, 0, 0.18);
}

div:has(#tabela-ao-vivo)::-webkit-scrollbar,
section:has(#tabela-ao-vivo)::-webkit-scrollbar,
.card:has(#tabela-ao-vivo)::-webkit-scrollbar,
.painel:has(#tabela-ao-vivo)::-webkit-scrollbar,
.tabela-container::-webkit-scrollbar,
.tabela-wrapper::-webkit-scrollbar,
.tabela-scroll::-webkit-scrollbar,
.card-tabela::-webkit-scrollbar,
.painel-tabela::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

div:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb,
section:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb,
.card:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb,
.painel:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb,
.tabela-container::-webkit-scrollbar-thumb,
.tabela-wrapper::-webkit-scrollbar-thumb,
.tabela-scroll::-webkit-scrollbar-thumb,
.card-tabela::-webkit-scrollbar-thumb,
.painel-tabela::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.35);
	border-radius: 999px;
	border: 2px solid rgba(15, 23, 42, 0.95);
}

div:has(#tabela-ao-vivo)::-webkit-scrollbar-track,
section:has(#tabela-ao-vivo)::-webkit-scrollbar-track,
.card:has(#tabela-ao-vivo)::-webkit-scrollbar-track,
.painel:has(#tabela-ao-vivo)::-webkit-scrollbar-track,
.tabela-container::-webkit-scrollbar-track,
.tabela-wrapper::-webkit-scrollbar-track,
.tabela-scroll::-webkit-scrollbar-track,
.card-tabela::-webkit-scrollbar-track,
.painel-tabela::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0.18);
	border-radius: 999px;
}

div:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb:hover,
section:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb:hover,
.card:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb:hover,
.painel:has(#tabela-ao-vivo)::-webkit-scrollbar-thumb:hover,
.tabela-container::-webkit-scrollbar-thumb:hover,
.tabela-wrapper::-webkit-scrollbar-thumb:hover,
.tabela-scroll::-webkit-scrollbar-thumb:hover,
.card-tabela::-webkit-scrollbar-thumb:hover,
.painel-tabela::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.55);
}

/* ===================================================== */
/* RODAPÉ FIXO */
/* ===================================================== */

body {
	padding-bottom: 58px !important;
}

#app {
	min-height: calc(100vh - 58px) !important;
}

.rodape-fixo {
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 9999;
	width: 100%;
	min-height: 46px;
	padding: 8px 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	box-sizing: border-box;
	background: rgba(15, 23, 42, 0.96);
	border-top: 1px solid rgba(250, 204, 21, 0.35);
	box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.35);
	backdrop-filter: blur(10px);
	color: #d1d5db;
	font-size: 13px;
	font-weight: 800;
	text-align: center;
}

.rodape-fixo span {
	color: #facc15;
	font-weight: 950;
}

.rodape-fixo strong {
	color: #ffffff;
	font-weight: 900;
}

@media (max-width: 640px) {
	.rodape-fixo {
		min-height: 42px;
		padding: 7px 12px;
		gap: 8px;
		font-size: 11px;
	}

	body {
		padding-bottom: 54px !important;
	}

	#app {
		min-height: calc(100vh - 54px) !important;
	}
}

