.conv-cipher-container { display: flex; flex-direction: column; gap: 20px; }

/* Painel de Controle de Rotação */
.conv-control-panel {
	background: #f8fafc;
	padding: 25px;
	border-radius: var(--conv-radius);
	border: 1px solid var(--conv-border);
	text-align: center;
}

.conv-shift-display {
	font-size: 3rem;
	font-weight: 900;
	color: var(--conv-primary);
	font-family: 'JetBrains Mono', monospace;
	line-height: 1;
	margin: 10px 0;
}

/* Toggle de Modo (Cifrar/Decifrar) */
.conv-toggle-wrapper {
	display: inline-flex;
	background: var(--conv-border);
	padding: 4px;
	border-radius: 50px;
	margin-bottom: 20px;
}

.conv-toggle-btn {
	padding: 8px 20px;
	border-radius: 50px;
	border: none;
	font-size: 0.7rem;
	font-weight: 800;
	cursor: pointer;
	transition: var(--conv-transition);
	text-transform: uppercase;
}

.conv-toggle-btn.active {
	background: var(--conv-primary);
	color: white;
	box-shadow: 0 4px 10px rgba(168, 29, 58, 0.2);
}

/* Explicação Didática */
.conv-explain-box {
	margin-top: 30px;
	background: #fffafa;
	border: 1px solid #fecaca;
	border-radius: var(--conv-radius);
	padding: 20px;
}

.conv-explain-title {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--conv-secondary);
	font-weight: 800;
	font-size: 0.9rem;
	margin-bottom: 10px;
	text-transform: uppercase;
}